jQuery Masonryってのは、grid-a-liciousみたいにdivをタイルみたいに並べるやつ。
htmlのhead内で次の2ファイルを読み込んで
<script type="text/javascript" src="jquery-1.3.2.min.js"></script> <script type="text/javascript" src="jquery.masonry.js"></script>
下のソースみたいのをbody内に書いて
<div id="primary"> <div class="box">ボックスボックスボックス</div> <div class="box">ボックスボックスボックスボックスボックスボックスボックスボックスボックスボックスボックスボックスボックスボックスボックス</div> <div class="box">ボックスボックスボックス</div> </div>
cssはこんな感じ。
#primary {
width:870px;
}
.box {
width:200px;
float:left;
background:#f33;
border-radius:5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
}
最後にBasic Examplesのページに書いてあったのを追加してみるけど。
$('#primary').masonry({
columnWidth: 100,
itemSelector: '.box'
});
普通に.boxをfloatした時と同じ表示にしかならない。
何を間違ってるんだろう(´；ω；`)ｳｳｯ…
functionで囲んだら動いた。
$(function(){
$('#primary').masonry({
columnWidth: 100,
itemSelector: '.box'
});
})
jQueryはそうやって使うのがデフォだから、わざわざexampleには記述されてない？
わからん( ´･＿･｀)
関連記事かもしれん:
- 新しい記事：WP2.9にしたら
- 古い記事：さくらインターネット｜phpMyAdminでオーバーヘッドを最適化
乱雑モックアップのフィード