A List Apartのエントリーから、CSS Spriteを使用したナビゲーションに、マウスオーバー時にアニメーションのエフェクトをつける「CSS Sprite2」を紹介します。 CSS Sprites2 - It's JavaScript Time demo 5 demo 6 CSS Spriteとは、スタイルシートで一枚の画像から複数箇所に配置をしたり、マウスオーバー時の画像指定を行うものです。 CSS Sprite2は、そのCSS Spriteにスクリプトを使用して、アニメーションのエフェクトつけたものです。 使用するスクリプトは、デモではjQueryが使用されていますが、PrototypeでもYUIなど他のスクリプトでも実装は可能です。 CSS Sprite2のベースとなっているのは、下記ページとのことです。
※ 画像は公式サイトデモより Ajaxを使っている場合、その結果通知をどのように行うかは困るところだ。せっかく画面遷移のない、格好いい仕組みを使っているのに、ただ「完了しました」だけではあまりにもおざなりだろう。 右上に通知が出る 各Webサービスとも、通知のウィンドウは色々な工夫が凝らされている。自分のサイトで格好いい通知をしてみたかったら、このような仕組みはいかがだろう。 今回紹介するオープンソース・ソフトウェアはjGrowl、JavaScriptで作られたGrowlだ。 GrowlはMac OSXをお使いの方であれば知っているであろう、通知を行うためのフレームワーク的アプリケーションだ。Firefox、Cyberduck、Skypeなどなど、大抵のソフトウェアで利用されている。通知メッセージは画面の右上に表示され、時間が経過すると自動で消えていく、非常に使い勝手の良いアプリケーション
jQuery is a fast, concise, JavaScript Library that simplifies how you traverse HTML documents, handle events, perform animations, and add Ajax interactions to your web pages. jQuery is designed to change the way that you write JavaScript. The cheat sheet comes in two flavors: Made for iPhone and iPod Touch, and any other mobile device with internet access: http://labs.colorcharge.com/jtouch. Read
Google AJAX APIを使うとjQueryをgoogleからダウンロードできます。これを使うと自分でサーバーに配置する場合に比べて以下のようなメリットがあります。 バージョン指定を最後までしないことで最新版を利用できる gzipによる圧縮を自動で行ってくれる（jquery.minだと54.5 KB->16 KBへ） 普及すればネット全体でjQueryをキャッシュできる デメリットとしては以下のような感じでしょうか。 インターネットにつながっていないとライブラリが利用できない（ローカルでの確認時の問題） googleのサーバーが落ちたら困る（ほぼないと思いますが。。） 使い方はhtmlで読み込んでいるscript要素を以下のように書き換えるだけです。 <script type="text/javascript" src="js/jquery-1.2.6.min.js"></scrip
I've been beavering away at the API behind the scenes for a little while, and if you follow me on Twitter you've probably already seen the API browser has already been upgraded. The key change I've made is to de-couple the API search engine from the front end. What this has resulted in, is a fairly simple API to create any number of bespoke front ends to the jQuery API browser. READER DISCOUNTSave
紹介済みから未紹介のものまで、jQueryのプラグイン34選です。 Kwicks スムーズに伸び縮み。 Horizontal Accordion 水平方向のアコーディオン。 Accordion Con
jQuery StyleSwichterは、ユーザーがスタイルシートを変更でき、変更したスタイルをクッキーに保存できる、設置が簡単なスクリプトです。 jQuery StyleSwichter デモページ スタイルシートの変更はレイアウトの色・スタイルや文字サイズなど、ユーザーの好みに合わせたブラウジングを提供することができます。 jQuery StyleSwichterの動作環境は、IE7, Fx2, Op9, Safari3となっています。 jQuery StyleSwichterはjQueryのプラグインのため、動作にはjquery.jsが必要です。
Kwicksは、Mootoolsにあるように領域をアニメーションでスムーズに収縮するスクリプトのjQuery版のスクリプトです。 Kwicks for jQuery デモ デモにある4つの矩形の領域はリスト要素となっています。 オプションとして、領域間のスペースの有無やアニメーションのタイミングを変更することが可能で、収縮させるのを矩形以外にして利用することも可能です。
It’s really amazing to see what one can create using jQuery. Developers just don't stop making incredibly interactive web applications every now and then. This post just demonstrates excellent examples of some of the best jQuery plugins out there. You can also take a look at the other jQuery Plugins in this series : 45+ Fresh Out of the oven jQuery Plugins 50+ Amazing Jquery Examples- Part1 So let
Technology Appleのサイトで使われているようなアコーディオンメニューを作成する方法『Slide out and drawer effect』 クールなアコーディオンメニューが作りたい。 そんなあなたにおすすめなのが、『Slide out and drawer effect』。Appleのサイトで使われているようなアコーディオンメニューを作成する方法だ。 このエントリーでは、jQueryを使ったクールなアコーディオンメニューの作り方が紹介されている。 ↓でデモが見られる。 » See the plugin version of the slide out effect とてもかっこいいので、ぜひ実装してみてはいかがだろうか。 Appleのサイトで使われているようなアコーディオンメニューを作成する方法、チェックして使っていきたいですね。 B-COMPANYからシェルフが届いて収納
vivalogoのエントリー「33のJavaScriptとFlashの最も美しいギャラリー」から、いくつか画像ギャラリーを紹介します。 33 Most Beautiful Javascript and Flash Galleries JavaScriptで実装する画像ギャラリー
jQueryとは、JavaScriptのコーディングを強力に支援するライブラリです。 $('.semooh a').hover( function(){ $(this).text('ヌ？'); }, function(){ $(this).text('ヌー'); } );
参考ページ Core JavaScript 1.5 Reference - MDC http://developer.mozilla.org/ja/docs/Core_JavaScript_1.5_Reference JavaScript - Wikibooks http://ja.wikibooks.org/wiki/JavaScript 【コラム】そろそろきっちりJavaScript (1) "Firebug"の導入〜関数リテラルとは? | エンタープライズ | マイコミジャーナル http://journal.mycom.co.jp/column/js/001/index.html a/PHPerの為のJavaScript解説 - PukiWiki http://kjirou.sakura.ne.jp/wiki_mirror/index.php?a%2FPHPer%A4%C
紹介済みから未紹介のものまで、jQueryのプラグイン34選です。 Galleria 画像ギャラリー。 jQuery Multimedia Portfolio 画像・動画・音声のスライドショー。 Ea
最近、jQueryを利用して書かれたソースのパフォーマンスチェックをしていて、jQueryのソースも見つつ色々と分かってきました。 jQueryのパフォーマンス最適化に関するTips で、↑このエントリで話題になっている class指定だとid指定より遅くなる。 $('div#hoge') と $('#hoge') では、$('#hoge')の方が早い。 という2点について、その理由を解説します。 ・class指定だとid指定より遅くなる。 javascript にはdocument.getElementById() という関数はありますが、class指定でHTMLElementを取得するメソッドは存在しません。 なので、class名で取得しようとした場合、検索対象のHTMLElementを総なめしてclass名をチェックする必要があります。 検索対象が多ければ多いほど当然遅くなっちゃいま
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
