画像を菱形状に並べるイメージギャラリーを実装するスクリプト・jquery.diamonds.js
以前よく見かけたタイプのイメージギャラリーを実装出来るスクリプトがあったのでメモ。菱形状に並べる、というものです。実用性は置いといて、素敵な見せ方ですね。 菱形状に画像を並べます。 こんな感じのイメージギャラリーを実装出来ます。尚、IE7等では大変なことになってしまうので使いどころに気をつけないとですね。 $("#foo").diamonds({ size :250 , gap :1 , hideIncompleteRow : false, autoRedraw : true, itemSelector : ".bar" });セッティングは上記の要領で書けばいいみたいです。ちょっと目を惹けるレイアウトですね。 jquery.diamonds.js
[JS]斜めのグリッドを使った美しいレイアウトを簡単に実装できるスクリプト -diamond.js
オプションを変更したキャプチャ diamonds.jsの使い方 Step 1: 外部ファイル jquery.jsと当スクリプト・スタイルシートを外部ファイルとして記述します。 <link rel="stylesheet" type="text/css" href="diamonds.css" /> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> <script type="text/javascript" src="jquery.diamonds.js"></script> Step 2: HTML ダイアモンド状に配置する各アイテムのclassに「.item」を添え、ラッパーで包みます。 <div class="d
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
