jQueryでニュースティッカーを実装する方法
Webサイト上での限られたスペースにお知らせなどの複数にわたる情報を表示させたい際に便利なニュースティッカー。 jQueryプラグインでもいろいろな形状のニュースティッカー用プラグインがありますが 、今回はシンプルな動き …続きを読む→
Webサイト上での限られたスペースにお知らせなどの複数にわたる情報を表示させたい際に便利なニュースティッカー。 jQueryプラグインでもいろいろな形状のニュースティッカー用プラグインがありますが 、今回はシンプルな動き …続きを読む→
jQuery LightBox2プラグインを使って大きい画像を表示させると、画面に収まらないためスクロールさせる必要がある。WordPressのLightBox2プラグインでは画面に収まるように自動調整を行う選択が可能で …続きを読む→
カルーセルとは回転木馬(メリーゴーランド)のことで、WEBではサムネイルが列をなして移動していくことを指している。 カルーセルの実装はcarouFredSelプラグインを使って行うことにした。 使い方はJQuery入門を …続きを読む→
File APIとはクライアント(ローカル)上にあるファイルをスクリプトを使って読み書きすることができるようにするものです。ただし、スクリプトで任意のファイルを選択することはできず、ユーザーが選択したファイルが対象となり …続きを読む→
HTML5からドラッグ&ドロップAPIが登場した。 これまでjQueryを使わないとできなかったが、HTML5でもできるようになったのでさっそく使ってみた。 操作は次のHTMLで画像一覧の画像をカートに移すことを試してみ …続きを読む→
jqueryのaddclassやremoveclassのようなことがHTML5で追加されたclassList APIを使ってJavaScriptだけで出来るようになった。忘れないよう備忘録しておく。 classList …続きを読む→
折りたたみ式の縦型メニューをjQueryを使って試してみました。 HTMLとjQueryは次のとおり <script type="text/javascript"> $(function( …続きを読む→
本をペラペラめくる風UI実装jQueryプラグイン「Booklet」。 基本構成は次のとおり簡単です。 <div id="mybook"> <div> 1ページ目のコンテンツ …続きを読む→
jQueryプラグイン「jQuery Masonry」を使うことで、各ボックスの高さを揃えなくても自動的に積み重なったレイアウトを作ることができる。 jQuery Masonryは次の公式サイトよりダウンロードする。 h …続きを読む→
jQueryでクリックした要素を知るには次のような方法がある。 $("a").click(function() { id = $(this).attr("id"); // id …続きを読む→