ホームページ > 記事 > ウェブフロントエンド > jQuery プラグイン bxSlider はレスポンシブ フォーカス map_jquery を実装します
優れた応答性の高い jQuery フォーカス マップ プラグイン bxSlider、優れた応答性の高いレイアウト デザイン jQuery プラグイン、アダプティブ
あらゆるデバイスに適しており、切り替えコンテンツはビデオ、画像、HTML、タッチデバイスのサポート、カスタム機能
コールバック、多数のパラメーターのカスタム構成をサポートし、ブラウザーは Firefox、Chrome、Safari、
をサポートします。
iOS、アンドロイド、IE7。
使用法:
1. jQuery とプラグインをロードします
<!-- jQuery library (served from Google) --> <script src="jquery/1.8.2/jquery.min.js"></script> <!-- bxSlider Javascript file --> <script src="/js/jquery.bxslider.min.js"></script> <!-- bxSlider CSS file --> <link href="/lib/jquery.bxslider.css" rel="stylesheet" />
2.HTML コンテンツ
<ul class="bxslider"> <li><img src="/images/pic1.jpg" / alt="jQuery プラグイン bxSlider はレスポンシブ フォーカス map_jquery を実装します" ></li> <li><img src="/images/pic2.jpg" / alt="jQuery プラグイン bxSlider はレスポンシブ フォーカス map_jquery を実装します" ></li> <li><img src="/images/pic3.jpg" / alt="jQuery プラグイン bxSlider はレスポンシブ フォーカス map_jquery を実装します" ></li> <li><img src="/images/pic4.jpg" / alt="jQuery プラグイン bxSlider はレスポンシブ フォーカス map_jquery を実装します" ></li> </ul>
3. 関数呼び出し
$(document).ready(function(){ $('.bxslider').bxSlider(); });
機能オプションの設定をカスタマイズしてください。
デモを見る 公式ウェブサイトのダウンロード
上記がこの記事の全内容です。皆さんに気に入っていただければ幸いです