[JS]ごく普通の画像を立体的にスライスしてアニメーションで切り替える画像ギャラリー -Slicebox
デモページ：垂直スライスでウェーブ状 Sliceboxの実装 HTML 画像をdiv要素で内包します。 <div id="sb-slider" class="sb-slider"> <img src="images/1.jpg" title="Creative Lifesaver"/> <img src="images/2.jpg" title="Honest Entertainer"/> <img src="images/3.jpg" title="Brave Astronaut"/> <img src="images/4.jpg" title="Affectionate Decision Maker"/> <img src="images/5.jpg" title="Faithful Investor"/> <img src="images/6.jpg" title="Groundbr
[JS]表示位置の微調整も可能、キュートなデザインのツールチップを実装するスクリプト -grumble
テキスト量を自動判定してサイズを大きく $('#grumble4').grumble( { text: 'Whoaaa, this is a lot of text that i couldn\'t predict', angle: 85, distance: 50, showAfter: 4000, hideAfter: 2000, } ); ); callback関数も用意されています。 $('#myElement').grumble({ showAfter: 1000, hideAfter: 2000, onShow: function(){ console.log('triggered when show animation completes'); }, onBeginHide: function(){ console.log('triggered when hide anima
iPhoneやiPadやネットブックなど、さまざまなスクリーンサイズでウェブサイトを確認できる -Screenfly
iPhoneやiPadやネットブック・ノートブック・デスクトップやテレビなど、さまざまな解像度のスクリーンでウェブサイトの表示を確認できるオンラインサービスを紹介します。 Screenfly [ad#ad-2] Screenflyの対応スクリーン 現在、対応しているスクリーンは下記の通りです。 Desktop ネットブック10インチ(1024x600) ネットブック12インチ(1024x768) ノートブック13インチ(1280x800) ノートブック15インチ(1366x768) デスクトップ19インチ(1440x900) デスクトップ20インチ(1600x900) デスクトップ22インチ(1680x1050) デスクトップ23インチ(1920x1080) デスクトップ24インチ(1920x1200) Tablet ViewSonic(800x480) Velocity Cruz(800
[jQuery Mobile]役立つコード集とつまづきやすいポイント | コリ
jQuery Mobileを使って、スマートフォン対応ページをはじめて作成する際に役立つコード、つまづきやすいポイントを紹介します。 10 handy jQuery mobile tips and snippets to get you started [ad#ad-2] 下記は各ポイントを意訳したものです。 スマフォ対応ページの基本HTML jQuery Mobileの利用方法 AJAXナビゲーションの停止 リストアイテムの省略を阻止 Media Queriesの利用 プラットフォームの特定 フォームを使用する際の注意点 ポップアップ ダイアログの作成 キャンセルとセーブのボタン カラム構造を作る時のポイント スマフォ対応ページの基本HTML まずは、スマートフォン対応ページを作成するための基本となるHTMLです。 HTML <!DOCTYPE html> <html> <head> <
[JS]リストで実装したアイテムにページ機能をつけるスクリプト -Ono List Pager
リスト要素で実装したアイテムをアニメーションでスライドするさまざまなインターフェイスのページ機能付きパネルにするjQueryのプラグインを紹介します。 最もベーシックなデモです。 パネルがアニメーションでスライドし、キーボードの矢印キーの操作にも対応しています。 HTML 各パネルはシンプルなリスト要素で実装されています。 <ul id="list1" class="onoPager_noJs"> <li>This basic pager offers paging per item. It also offers a 'previous' and next 'next' button. it also offers direct links to each page item.</li> <li>...</li> <li>...</li> </ul> JavaScript jQuery(
50 Must Have Cheat Sheets For Web Designers & Developers | SmashingApps.com
by Akhter · July 13, 2011 50 Must Have Cheat Sheets For Web Designers & Developers Today we are featuring a collection of more than 50 extremely useful cheat sheets that every designer and developer must have. A cheat sheet is a guide of a peculiar programming language, software or framework that can be printed for easy access. Cheat sheets are basically intended for those designers and developers
[JS]美しいエフェクトを備えた水平タイプのアコーディオンのスクリプト -zAccordion | コリス
滑らかなスライドのアニメーション、繊細なドロップシャドウ、フェードで表示されるインフォボックスなど、美しいエフェクトを備えたアコーディオンのjQueryのプラグインを紹介します。 zAccordion - A Horizontal Accordion Plugin for jQuery 上記ページのスライドは、跳ね返るバウンスのアニメーションになっています。 [ad#ad-2] zAccordionのデモ デモでは、最小限の機能を備えたものから、最大限に拡張したもの、ちょっと面白いものまでが揃っています。 zAccordion — An Inverted Accordion スライドの重ね順を反転させたちょっと面白いデモ。 zAccordionの実装 HTML アコーディオンの各パネルはリスト要素で実装します。 <ul id="featured"> <li> <image src="/im
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
