このエントリーをはてなブックマークに追加

透明度を利用したロールオーバープラグイン jquery-opacity-rollover.js:ボタンやバナーなど、ロールオーバー時に透明度を付けて表示出来る。IDかクラスを付けて設定するので背景画像にも使え、リンク画像にも使える。

スムーズスクロール scrollsmoothly.js:スムーズスクロールのjs は色々あるが、IE6でもIE8でも動き、特に設定は不要で、別ページへのアンカーリンクでもエラー無く動くので、これをお薦めします。

動きのきれいなプルダウンメニュー MenuMatic :リンク先に詳細とサンプルがあるので、見ていただけばわかりますが、動きがとてもきれいで縦横どちらもOK。設定の仕方もわかりやすいので使いやすいかと。
*サンプルのcssにはjava-script がオフの時用の設定も付いています。
*デフォルトで透明度が付いてますが、これを変更するには css ではなく js で opacity の値を変更。

グーグルマップの吹き出しを消すには… ↓を追加する。

amp;iwloc=B

 

複数のプルダウンを連動する Dependent Select:複数のプルダウンに親と子を設定して、親の選択(例えばA、B)によって子の内容(例えば親の選択がAの場合はA-1、A-2、A-3、親の選択がBの場合はB-1、B-2など)を変えるというもの。カートに商品を入れるタグなどで役立つ。
*親に対して子が1つでダイレクトに表示させたい場合は71行目と75行目のoption~/option を削除。

角丸を作るCurvyCorners:div の背景、ボーダーを角丸にする。スクリプトを読み込み、cssに-webkit-border-radius、-moz-border-radius を設定しておくだけでIEでも角丸にしてくれる。
cssのエラーが気になる場合は
[source language=’html’]
[/source]
のように設定。div以外の要素にも使いたい場合は、script の(“div”)の設定部分に(“div”,”li”,”a”)のように書き足す。ライブラリを使用しないので使いやすい。

コンテンツの開閉 Simple Accordion :jQuery プラグイン(jquery-1.4.2.min.js) ダウンロードするとサンプルが入っているので、それを真似て書けば難しくない。

2010.01.15 投稿 2015.04.05 更新

新しい情報を追記している場合はありますが、古い情報の修正はしていません。投稿日・文中の日付を参照してください。

Recent Articles