指定した要素を直接していしてLightBox風表示させられるjQueryプラグイン「Lightbox_me」 2010年05月31日- Lightbox_me - Stupidly Simple Lightboxing 指定した要素を直接していしてLightBox風表示させられるjQueryプラグイン「Lightbox_me」。 通常、LightBoxというと、画像や動画などをポップアップで表示する際に用いられます。別ページを開く場合にもiFrameを使ったりして実現されますが、このプラグインは少し違います。 <div id="hogehoge">hogehoge</div> という要素があったとすると、$("#hogehoge").lightbox_me(options) のようにすることで、指定した要素自体をLightBox風に表示させられます。 このプラグインを使うことで、予めHTM
View Demos 1 2 3 4 5 Released under the MIT License, source on Github (changelog) Download Install via NPM npm install jquery-colorbox Compatible with: jQuery 1.3.2+ in Firefox, Safari, Chrome, Opera, Internet Explorer 7+ Supports photos, grouping, slideshow, ajax, inline, and iframed content. Lightweight: 10KB of JavaScript (less than 5KBs gzipped). Appearance is controlled through CSS so it can
画像の切り替えでユーザーに驚かせることができそうです。 jQueryプラグインのJquery.ImageSwitchはフェードインなどのよくあるパターンだけではなく、ダブルドアと名づけられた切り替え方も可能です。 sponsors 使用方法 Jquery.ImageSwitchからGroject.ImageSwitch.jsを、jQueryからjquery.jsをダウロードします。 <script type="text/javascript" src="jquery-1.3.2.js"></script> <script type="text/javascript" src="Groject.ImageSwitch.js"></script> <script> $(document).ready(function(){ $("#id名").click(function(){ //切り替える
AJAXによって複数の好きな画像を一気にアップロードし、それをフォトギャラリーとしてページに埋め込んで表示できるのがこの「dfGallery 2.0」。フルスクリーンモードにすることもでき、FlickrやPicasaのアルバムと連携可能で、カスタムテーマとマルチスキンによって見かけやレイアウトを大幅かつ自由に変更可能で、さらに管理用のコンソール画面、複数のギャラリーセットとアルバムのサポート、BGMの再生なども可能です。これだけ高機能であるにもかかわらずフリーでの利用(Apache License 2.0)が可能となっており、あらゆる局面で利用可能となっています。 実際の動作デモやインストールとカスタム方法を解説したムービーの再生などは以下から。 dfGallery 2.0 - Free Flash Gallery | Dezinerfolio 上記ページからこの「dfGallery 2.
ãããã«æ»ã ãã£ã¼ã ãµã¤ãº ãã£ã¼ãã®ãµã¤ãºã¯ãchs=<width in pixels>x<height in pixels> ã§æå®ãã¾ãã ãã¨ãã°ãchs=300x200 ã®å ´åã横 300ãã¯ã»ã«ã縦 200 ãã¯ã»ã«ã®ãã£ã¼ããçæããã¾ãã å°å³ä»¥å¤ã®ãã¹ã¦ã®ãã£ã¼ãã®æ大é å㯠300,000 ãã¯ã»ã«ã§ãã横ã¨ç¸¦ã®æ大å¤ã¯1000 ãã¯ã»ã«ãªã®ã§ãæå
ご訪問いただいたお客様へのお知らせ アクセスいただいたWebサービスは提供を終了いたしました。 長年にわたり、多くの皆様にご利用いただきましたことを心よりお礼申し上げます。 ODNトップページへ
かっこいいナビゲーションメニューをさくっと実装したい。 そんなあなたにおすすめなのが、『300+ Jquery, CSS, MooTools and JS navigation menus』。jQueryやCSSを使ったナビゲーションメニュー300選だ。 以下にいくつかご紹介。 » Fancy menu かっこいいナビゲーションメニュー » Amazing apple style navigation menu Appleのサイトのようなナビゲーションメニューの作り方。↑のキャプチャはこちら » jQuery idTabs 8つのクールなjQueryメニュー » navigation-3 プルダウンメニューなど4つの例 » block-navigation CSSデザインのメニュー9選 その他のリストは以下から。 » 300+ Jquery, CSS, MooTools and JS na
画像にマウスオーバしたときにオーバレイで画像を表示したい。 そんなあなたにおすすめなのが、『Style Your Image Links』。画像にマウスオーバしたときに虫眼鏡アイコンを表示するJavascriptだ。 このJavascriptでは、画像にマウスオーバしたときに枠を表示したり、アイコンやボタンを表示したりすることができる。 ↓にデモがあるので見てみてほしい。 » Style Image Links With Javascript ちょっと画像にエフェクトをかけたいときに便利ではないだろうか。 画像にマウスオーバしたときに虫眼鏡アイコンを表示するJavascript、チェックして使っていきたいですね。 昨日は車でお茶の水行ったあと新宿で飲み。とても楽しかった。 それで原付かクロスバイクがほしくなってきてしまった。どうしよかな。 これからMacと一眼レフ持って開発合宿行ってきます
"/> jQuery Multimedia Portfolio multi-format carousel for jQuery mercredi 21 novembre 2007 Non obstrusive and accessible portfolio supporting multiple media : photos, video (flv), audio (mp3). <link rel="stylesheet" href="css/multimedia-portfolio.css" type="text/css" media="screen" /> <script type="text/javascript" src="js/jquery.js"></script> <script type="text/javascript" src="js/jquery.dimen
JavaScriptライブラリのmootoolsのプラグインを利用して出来るサンプルです。 Ajaxライブラリの一つmootoolsは、必要十分なメソッドに抑え、軽く、早いのが特徴です。 ここでは、画像関連、メニュー関連、フォーム関連、テキスト関連、その他、日本語未解説の分類でAjaxライブラリmootoolsを紹介しています。 Image(19) Menu(13) Form(8) Text(9) Other(18) W/O_JP(45)
twitter facebook hatena google pocket 最近はappleのcoverflowやらamazonのぐるぐるやら画像の見せ方が豊富になってきました。 今回紹介する「Spacegallery.js」はありそうでなかった、手法かもしれません。 奥から手前にずんずんとズームしながら画像を表示していきます。 sponsors 使用方法 Spacegallery.jsのDownLoadからファイル一式をダウンロードします。 あとは以下を記載します。 <link rel="stylesheet" media="screen" type="text/css" href="css/spacegallery.css" /> <script type="text/javascript" src="js/jquery.js"></script> <script type="text
twitter facebook hatena google pocket 最近amazonライクにぐるぐる画像を回すサイトが多くなっています。 今回はそんなぐるぐるを流行のjqueryで実現する3D Image Carouselです。 sponsors 使用方法 3D Image CarouselのDownLoad Filesからファイル群をダウンロードします。 <script type="text/javascript" src="jquery-1.2.6.min.js"></script> <script type="text/javascript" src="Tween.js"></script> <script type="text/javascript" src="jquery.tooltip.min.js"></script> <script type="text/javas
Yahoo! UI Library の YAHOO.widget.Tooltip オブジェクトのツールチップ機能と、 Simple API のサムネイル画像取得サービスを組み合わせて、 マウスオーバーでリンク先サイトのサムネイル表示を行うデモです。 Yahoo! JAPAN PC Watch asahi.com Yahoo! UI Library: Tooltip kawa.net xp ゆうすけブログ Flickr: Photos from Yusuke,SF 上記リンク部分にマウスカーソルを乗せると、サムネイルを表示します。 ソースコード 短いです。YUI と SimpleAPI に感謝! <script type="text/javascript" src="js/yahoo.js"></script> <script type="text/javascript" src="js/e
公式サイト ライブラリを使ったデモ ライセンス:MITライセンス prototype.js/script.aculo.usを使った同一ページ内ダイアログ作成ライブラリ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く