そんなに難しいことをしようと思ったわけではなく、ホームページ・ビルダーにおまけで付いてくるウェブ・アニメータ程度のことができればいいかなと思って、調べたら意外とやさしく書いてあるところがなかったので、超簡単な導入部だけメモしておきます。
1.まず、PhotoShopで新規ページを開きます。画像がある場合はそれを開けばいいです。
2.ウィンドウでアニメーションを表示させます。そうするとアニメーションのウィンドウが画面下に出てくるはず。
3.最初、アニメーション・ウィンドウはタイムラインになっていると思いますので、画面右下のアイコンをクリックして、フレームにしておきます。
4.あとは、この画像のアイコンをクリックするとフレームがコピーされますから、フレームごとに表示するものを変えていけばOKです。レイヤーで制御(表示・非表示や移動など)するということです。
have a nice animation!
GIFアニメーションの作成はやさしく書いてあって参考になりました。
WordPressの中での jQuery
TipsWordPressでは jQuery は、Prototype など $ 関数を使用する他のライブラリと同時に使用することを想定して、jQuery.noConflict() が実行されており、$ 関数はそのまま使えません。
まぁ、$を使うべきところを jQuery と書けばいいだけなんで、いいっちゃいいんですが、字数も 1文字から 6文字に増えて面倒です。
そういうときは先人の知恵でよくわからずに、こうやって $を使っていたんですが、・・・
ちゃんとわかろうと思って、いろいろググって勉強してみました。
こちら(jQueryと他のライブラリを同時に使用する方法)です。勉強になります。
スムーズスクロール
Tipsいままで食わず嫌い(シュルシュルシュルってスクロールして何が楽しんじゃい?!)していたスムーズスクロールですが、縦幅3400pxもあるページをデザインしていて、一番下からすぐ上にページが切り替わっても、ありがたみがないんじゃないかと思って、使ってみることにしました。
使ってみたのは、こちら(こだわりのページ内リンクスムーズスクロール scrollsmoothly.js)。
設置簡単、指定いらず、依存ライブラリなしと、いまのところ言うことなし。ありがとうございます。
PhotoShop CS4でGIFアニメーションを作る方法
Tipsそんなに難しいことをしようと思ったわけではなく、ホームページ・ビルダーにおまけで付いてくるウェブ・アニメータ程度のことができればいいかなと思って、調べたら意外とやさしく書いてあるところがなかったので、超簡単な導入部だけメモしておきます。
1.まず、PhotoShopで新規ページを開きます。画像がある場合はそれを開けばいいです。
2.ウィンドウでアニメーションを表示させます。そうするとアニメーションのウィンドウが画面下に出てくるはず。
3.最初、アニメーション・ウィンドウはタイムラインになっていると思いますので、画面右下のアイコンをクリックして、フレームにしておきます。
4.あとは、この画像のアイコンをクリックするとフレームがコピーされますから、フレームごとに表示するものを変えていけばOKです。レイヤーで制御(表示・非表示や移動など)するということです。
have a nice animation!
GIFアニメーションの作成はやさしく書いてあって参考になりました。
WordPress 2.9.2
WP Tips久々に最新版の WordPress(MUじゃないシングル版の方)に触ったら、いろいろ忘れてて焦った。
どっちも自分が悪いし、同じ原因でした。
インストール時に、インストールディレクトリのパーミッションを 777とか 755とかにしておいて最後までちゃんとやればよかったんだけど、どうやらこの現象が出るということは途中でパーミッションを戻したみたい。たぶん普通にやると、uploadsも .htaccessも作られるはず。
.htaccess なしにどうやって URLをさばいているのか、小一時間悩んじゃったよ。uploadsの方は、upgradeフォルダにパーミッションをあげたりしてて、なんでかな?状態になっていたことはヒミム。
jCarousel Lite
WP Tipsいまデザインをやってるサイトで使う予定の画像を横に自動的にスライドする jQuenyツールです。
横向きにスライドするのは、カルーセルっていうんですね。覚えておいて損はないかも。(MAKIではない!)
ここが本家です。
ここが本家の本家です。
使うつもりなのは、表題通り「jCarousel Lite」
『jCarousel Lite jsを使ってみました。』を参考にさせていただきました。(まだ試してないけど)
サイドバーを固定にしたサンプル
Tipsサイドバーを固定にしたサンプル
あとで試してみる
こことか、かっこいい!
くるくる回るナビゲーションメニュー
もあとで試してみる