無料でビットコインをもらえるのは、ビットフライヤー

[み]jQuery Masonryの超基本的な使い方

jquery

ボックス要素をレンガのように敷き詰めてレイアウトしてくれるjQuery Masonryの基本的な使い方です。当然、Masonryの配布サイトには使い方が説明してありますが、いかんせん英語なんで… なので、超基本的な使い方として紹介します。

jQuery Masonryをダウンロード

jQuery Masonryは公式サイトからダウンロードしてください。
jQuery Masonry

あとは、適当なところにアップロードしてください。

jQuery Masonryの使い方

まず、jQueryを読み込む

jQuery本体とともに、jQuery Masonryを読み込みます。
[cc lang=”html”]

[/cc]

HTML

[cc lang=”html”]
[/cc] id名、class名はなんでも大丈夫です。

JavaScript

[cc lang=”JavaScript”]
[/cc] columnWidthはpaddingやmarginを含めたitemの横幅を指定します。isAnimatedはアニメーションさせたいときにtrue、別にいいよっていうときはfalseを指定します。

以上で、超基本的な使い方はおしまいです。英語がわかるようになりたいです…

jQueryを勉強しましょう

htmlとかCSSとかはなんとなくわかってきたんだけど、jQueryって聞くとなかなか手がでない… そんな方はきっとたくさんいますよねw でも、jQueryって、実はカンタンなんです。

でも、jQuery 日本語リファレンスとか見ても、これをどう使ったらいいのかいまいちピンとこない… ええ、たしかにそうですよね。ある程度わかってくると、リファレンス見ても理解できるんですが、最初のとっかかりとしては、なかなか難しいと思います。

なので、そんな方には、本をおススメします。KindleとかKoboとか電子書籍がこれだけ世の中に広まったというのに、紙の本をおススメします!

実際にWebサイトでの使用例が載っているので、jQueryってこんなことできるんだ!という感想を持ちます。それで、もちろんコードも載っているので、自分のサイトにも応用できちゃうわけですね。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です