power-doctest という doctest風 にコードと評価結果のコメントを並べるとテストとして実行出来るようなNode製のツールを作りました。
前回は、シンプル、ギャラリー編と称して、lightboxの違いをわずかですが、紹介しました。 今回は動きのあるlightboxプラグインを次いでご紹介。 sexylightbox デモ ダウンロード 使用ライブラリ:mootool.js(ver.1.2) 対応形式:画像 実行すると上からモーダルウインドウが勢い良く振ってくるライトボックス。エンターテイメントなサイトで使うと躍動感を出したり、サイトの印象にインパクトが出ます。 使い方: 1.ダウンロードした画像フォルダとcss,jsファイルなどを任意の位置へ配置して呼び出し。 <link href="SexyLightBox/sexylightbox.css" rel="stylesheet" type="text/css"> <script type="text/javascript" src="SexyLightBox/mooto
Posted on: 2012/04/06 CSS3やHTML5の対応状況を判別するクロスブラウザJavaScriptライブラリ「Modernizr」 HTML5 や CSS3 はバリバリ使っていきたいところですが、ブラウザの対応状況も気になるところです。(実際に非対応なのはIEだけなのでどーでもいいけど) HTML5 や CSS3 を使うということは、古いブラウザを犠牲にする可能性もあります。(実際に非対応なのはIEだけなのでどーでもいいけど) ということで、 CSS3やHTML5の対応状況を判別するクロスブラウザJavaScriptライブラリ Modernizr なにができるのか? ブラウザの HTML5 や CSS3 などの対応状況を判別し、HTML要素にクラスを付加してくれます。 <html lang="ja"> ↓ <html lang="ja" class=" js flexb
BlocksIt.jsの使い方 Step 1: 外部ファイル 「jquery.js」と当スクリプトをhead内に記述します。 ※jQueryは1.7.1で開発。 <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.js"></script> <script type="text/javascript" src="blocksit.js"></script> Step 2: HTML HTMLは対象となる範囲をラッパーで包み、各パネルを同列に配置します。 パネルはデフォルトでdiv要素を対象にしていますが、任意の要素で実装できます。 <div id="container"> <div>パネル</div> <div>パネル</div> <div>パネル</div
HTML5 では <script> タグに async という属性が加わってまして、これを指定しておくと src で指定された JavaScript ファイルの実行が非同期で行われます。(src 属性を指定しないと async は意味を持ちません。) <script type="text/javascript" src="http://..." async="async"> </script> ググってると async の値として async=”true” を指定しているページが多いようですが、W3C の HTML5 の定義(4.3.1 The script element と 2.4.2 Boolean attributes 参照)だと空の文字列か属性名そのものを指定しろってことになってますので、こっちが正しいです。(たぶんw) If the attribute is present,
タッチイベントを取得する各スクリプトの対応イベント、スタンドアローンなのかjQueryが必要なのか、ファイルの容量など、仕様の比較をまじえて紹介します。 QUOjs イベント タッチ、タップ、ダブルタップ、ホールド、フィンガー、スワイプ、スワイプアップ、スワイプライト、スワイプダウン、スワイプレフト、ドラッグ 補足 jQueryとのコンフリクトを避けるため、「$$」を使用。 対応予定(2フィンガータップ、ロウテイト、ピンチアウト、ピンチ) 仕様 スタンドアローン ファイルサイズ Minified: 13KB Hammer.js イベント タップ、ダブルタップ、ホールド、ドラッグ、ピンチ 補足 タッチジェスチャだけにフォーカスしたスクリプト。 仕様 スタンドアローン jQueryのプラグインも有り ファイルサイズ Minified: 2KB [ad#ad-2] jGestures イベント
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く