ここがおすすめ
簡単なコードを書くだけで、かっこいいアニメーションでコンテンツを表示させることが出来ておすすめです。
サンプル
公式サイト
導入方法
このプラグインを使うには、
- 1.ファイルの取得と読み込み
- 2.htmlファイルへのプラグイン呼び出しの記述
-
3.htmlファイルに表示させるコンテンツを記述する
が必要になります。
以下、詳しく解説します。
必要ファイルの取得と読み込み
必要ファイルは
- bringins.js
- jQuery本体
bringins.jsは上記公式サイト内、Downloadボタンから。
jQuery本体はjQuery公式サイトより。
以上2ファイルをhtmlファイルに読み込ませます。
<script type="text/javascript" src="script/jquery-1.12.0.min.js"></script> <script type="text/javascript" src="script/bringins.js"></script>
htmlファイルへのプラグイン呼び出しの記述
続いて、プラグインを呼び出すためのコードをhtmlファイルに記述します。
$(document).ready(function() {
$('#sampledata').bringins();
});
3.htmlファイルに表示させるコンテンツを記述する
最後に、htmlファイルに表示させたいコンテンツを記述します。
<div id="sampledata" class="bringins-content">
Your content goes here...
</div>
動作させたい要素のIDとプラグイン呼び出しに記述するIDを合わせてください。この例だと”#sampledata”となっています。