写真をタイル状に並べてくれるjQuery「jMosaic」
jMosaic 写真の高さなどを自動的にリサイズしてタイル状に並べてくれるjQuery「jMosaic」です。 使い方 使い方は簡単で、jQueryと「jquery.jMosaic.js」を読み込みます。 <script src="js/jquery.js"></script> <script src="js/jquery.jMosaic.js"></script> CSSを読み込みます。 <link rel="stylesheet" href="css/jquery.jMosaic.css"/> HTMLは単純にdivで囲み、画像を挿入するだけです。 <div class="pictures"> <img src="img/one.jpg" width="267" height="400"/> <img src="img/two.jpg" width="500" height="350"
【JavaScript】カード型レイアウトを簡単に実装できる［Minigrid］の使い方
今日紹介する［Minigrid］はカード型のレイアウトを簡単に実装できる超軽量JavaScriptライブラリです。 Minigrid : http://minigrid.js.org ほぼ同機能のjQueryプラグインでは［Masonry］［Isotope］［Freetile］などが有名ですが、これらと並んで選択肢の１つとして使えそうです。 実装方法も比較的簡単なので初心者の方にもオススメ。またjQuery無しで単体で動く点もポイントが高いですね。 まずは公式サイトから必要なファイルをダウンロードしてきます。 Minigrid : http://minigrid.js.org スクリプトを読み込む フォルダの中に「minigrid.min.js」というファイルが梱包されているので、これをHTMLの適当な箇所で読み込みます。 ここでは仮に<body>〜</body>内の最下部に設置しましょう
jQuery プラグイン Masonry の使い方と設定 | Web Design Leaves
jQuery プラグイン Masonry の使い方と設定 CATEGORY: jQuery | TAG: プラグイン, レスポンシブ 2014年12月6日 ブラウザの幅に応じて、配置した要素のレイアウトを整列してくれる jQuery プラグイン Masonry の使い方や設定に関する個人的なメモ。 Lazy Load や Magnific Popup も一緒に使ってみた。 ★ CSS Grid + JavaScript で Masonry レイアウト も御覧ください（こちらの方が新しい情報です）。 この時点でのバージョン：v3.2.1 目次 jQuery プラグイン Masonry のダウンロード Masonry のページの「Download masonry.pkgd.min.js」を右クリックで「名前をつけてリンク先を保存」を選択するか、「Download masonry.pkgd.mi
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
10 Code Snippets for Creating Masonry Grid Layouts
要素をタイル状に並べる軽量プラグイン「Freetile.js」 | バニデザノート
