2014年8月5日SHAREツイートシェアはてブLINEツイートシェアはてブLINEタイトルがえらく長いですね。Masonryを使って、キレイに並べたよ!っていう話です。ん、タイトルそのまんまですね...。昨日紹介したコードでは、テキストも表示していましたが、今日のは端折って画像だけにします。いうか、画像だけのほうがMasonryっぽいと勝手に思ったからです。Masonryを導入します。導入の仕方は、こちらを参考にしてください。Masonryの超基本的な使い方まずは、コードです。class=”pics”で囲ってやるとOKです。このコードだとこんなカンジになります。その1とても残念な見た目ですね。Masonry側でdivのheightを決めてしまうためにこうなっているんだと思います。そのため、ブラウザのウィンドウサイズを変更すると、キレイに表示されます。その時点では画像の読み込みが完了しているからですね。Masonryを動作させたい場合は、imagesLoadedというメソッドを指定します。これで、最初から画像をきちんと読み込んでキレイに表示されます。APIjQueryレスポンシブ関連記事[み]鯖江市がいろんなデータをxmlで提供してるから「さばえ避難所マップ」をつくってみた[み]自分のお気に入りのラーメンとかを登録する「みはらマップ」をつくった[み]jQueryでInstagramのAPIを使ってみた。コメントをキャンセルメールアドレスが公開されることはありません。※サイトΔ{{#message}}{{{message}}}{{/message}}{{^message}}送信は失敗しました。{{status_code}})。このフォーム処理機能の開発者に連絡して、このメッセージを改善してください。詳しく{{/message}}{{#message}}{{{message}}}{{/message}}{{^message}}送信は成功したようです。送信が処理されていない場合があります。このフォーム処理機能の開発者に連絡して、このメッセージを改善してください。reserved.モバイルバージョンを。