これまでに使った20のjQueryプラグイン :: 5509
5509のnoriさんとチャットで会話しているときに
なんて話題になったので、ＴＢ（トラックバック）企画にしちゃいます！
自分の普段使うプラグインやこれは便利だ！なんてプラグインを書いてエントリーに書いて、トラックバックしてください！
どうしてもOSに依存してしまうアラートボックスやダイアログボックス。しかし、それをきれいに見せてくれる「jQuery Alert Dialogs」というのがある。仕事で、ダイアログボックスを変えたいとの要望があったようで、これを使ってみることにしたので、メモ代わりにエントリー。
「jQuery Grab Bag」で、『Text Effects Plugin』というテキストにエフェクトを加えて表示するプラグインが紹介されていました。なかなかユニークだったので紹介がてら試しに使ってみることにします。
続きを読む »
inputlog -yuga.js 0.7.0 - 優雅なWeb制作のためのJavaScript
Webサイトを制作する際に「こんな機能があったらなー」というのを実現してくれる、
jQueryのプラグイン「yuga.js」
そのyuga.jsがバージョンアップしたようなので書いておきます。
画像の拡大にLightboxとかThickboxとかを使うのですが、
他にもいろいろ出ているので、自分のメモのために一覧にしておく。
一覧はライブラリごとにまとめてみました。
まとめてみると、いろいろあるものですね。
なんだかいろんなところで紹介されている、
シンプルだけどかっこいいフォトギャラリー、
「Simple Controls Gallery」
使いやすいのかどうかも見るために使ってみることにした。
設定の仕方や注意点なども書いておいたので参考にしてください。
続きを読む »
jQueryのプラグインとかを見ていた時に、
なにやら面白そうなプラグインを発見。
画面全体やもしくは要素に対して、
半透明のレイヤーを表示させてブロックするプラグインだ。
使う機会はでてくるかわからないけど、
とりあえず使って試したくなったので、
勉強のためにメモエントリーしておく。
はっ！？内容とリード文があってない！？
ってことでいつのまにやら修正しておく。
背景色とか文字色とか、色関係をアニメーションさせようと思っても、
どうやらjQuery単体ではアニメーションできない。
なぜ！？
とまぁ、背景とか色関係をアニメーションで使いたいなと思ったので、
色関係を扱えるようにするプラグインを見つけたので、メモエントリーしておく。
最近jQueryのプラグインの紹介ばかりですが、
今日もjQueryのプラグインの紹介。
今日はjQueryのプラグインで、
簡単に角丸にしてしまうものを紹介します。
有名なのだと「jQuery Corner」なのですが、
JQuery Curvy Cornersの方が画像とかにも使えるので、
こっちのほうが利用するケースが多いかなと思い使ってみました。
最近PNGでの表現が流行り？
ちょっとその辺は情報不足なので省略しますが、
今日はjQueryのプラグインを使って透過PNGをIE6に対応させてみます。
透過PNGを使えるほうにする方法は、
すでにいろいろな方法が紹介されていて、最近でも、
「IE6にPNG画像のアルファチャンネルを効かせる方法のまとめ」
なんてのが紹介されたりしています。
今回紹介するjQueryのは、もうかなり前からあるのですが、
個人的に知らなかったので、メモとしてエントリーしておきます。
URLとかリンクの前に、サイトのファビコンが表示できたらなー
なんて思ってjQueryでできないか考えてみたけど、
なかなか難しい技術のようだってことはわかった。
自分でスクリプト作るのは難しいかな？
とりあえずプラグインなどをみつけたのでまとめておく。
続きを読む »
昨日書いた
「jQueryを使ってメニューを装飾：LavaLamp menuを使ったメニューを作ってみる」
いろいろ間違い等もあったのですが、現在IE6以外では正常に動作するようになりました。
IE6では、なぜか動作中の背景画像を毎回ダウンロードしに行っているようで、
かなり動作が重くなってしまい、それ故スムーズに動作しなかったようです。
画像があるところのサーバーが違うからなのだろうか？
自分のパソコン内で実験してみたときは、
IE6でも、画像が途切れてしまうCSSの設定ミスはあるものの、
スムーズに動作していたので、たぶん読み込みの問題なのだろうなって思います。
さて、昨日は画像だけでやってみたのですが、
参考サイトをみてみたところ、他のサンプルもあって、
画像じゃなくてもできるようだったので、
そちらのサンプルも作ってみる事にしました。
今回は背景色やボーダーの設定で作ってみました。
若干バランスは悪いですがご了承ください。
続きを読む »
同じ会社のYさんが、動くメニューが作りたいということで、
JavaScriptでアニメーションするようなメニューを探していた。
そしてYさんが「Fancy menu」というのを見つけていた。
Mootoolsのライブラリを使って動作するものらしい。
MootoolsではなくてjQueryのプラグインで無いかなって探したところ、
「LavaLamp menu」というプラグインを発見。
いろいろなところで利用できそうなので、試しに使ってみた。
※現在IEだとうまく動作しない様子。
CSSの設定がうまくいっていないのもあるので後ほど調節予定。
※追記（8/22）
IE7ではうまく動作するようです。
IE6ではここのブログ上ではうまく動作しない現状です。
※追記
全体的にうまく動作していないので後で修正します。
今はまだスムーズに動いてくれないようです。
※追記（8/22）
ネタ元：jQueryを使ってApple風デザインのナビゲーション | CSS Lecture
ちょうどjQueryのプラグインを探していたときに、
この「Kwicks for jQuery」をみつけて、
同じタイミングで、CSS LectureのMIYAさんがエントリーを書いていたので、
僕も使ってみる事にしました。
ただ、そのまま同じのをあげるのもなんなので、
自分で画像も簡単に作って使ってみました。
そして作っているときに、IEでのバグというか、
問題が起こることも見つけたので、それも書いておきます。
とある友人が、先日エントリーした「札幌の花火大会を見てきた：フォトアルバム」をみて、
「写真をクリックしたら、画面に綺麗に表示されるJavaScript、
それの導入方法が知りたい。！」
という様な連絡があった。
メールで書いて送ろうかとも思ったんだけど、
自分でも再度復習を兼ねて、ブログのエントリーにしてみた。
以前にもエントリーしたことがあるのですが、
今回もjQueryとそのプラグインを使って、
ブログとかサイトで写真や画像をLightboxを使って表示させる方法を説明します。
写真を張って、その写真へのリンクをつけるだけで、
自動的にLightboxで表示させる方法も書いておきます。
ちなみに以前のエントリーは関連エントリーを参照してください。
続きを読む »inputlog - yuga.js 0.6.0 - 優雅なWeb制作のためのJavaScript
jQueryを使い、優雅なWeb制作をするためのJavaScript「yuga.js」
そのyuga.jsがバージョンアップしたようです。
前のエントリーのの続きとして書きます。
前回のエントリー以降、他のJavaSctiptを調べた結果、
原因を発見、なんとかjQuery LightBox pluginで表示できたので、
あらためてエントリーしておきます。
今までは画像をクリックしたらthickboxで画像を表示してました。
それよりもLightBoxの方が綺麗だなって思ったので、
早速変更しようとしたのですが、
なぜか表示できなかったのでとりあえずメモしておきます。
