視覚的な差分効果を備えたjQueryレスポンシブカルーセル効果

黄舟
リリース: 2017-01-19 14:50:07
オリジナル
1483 人が閲覧しました

簡単なチュートリアル

これは、視覚的な差分効果を備えた jquery 応答性のカルーセル効果です。このjqueryカルーセル画像の特徴は、マウスドラッグで切り替えられることと、各画像にかっこいい透明文字が入っていることです。カルーセル画像は、スライド時に視覚的な差分効果をもたらします。

使い方

jquery、main.js、カルーセルのスタイルファイルstyle.cssをページに導入します。

<link rel="stylesheet" href="css/style.css">
<script src="path/to/jquery.min.js" type="text/javascript"></script>
<script src="js/main.js"></script>
ログイン後にコピー

HTML 構造

jquery カルーセルの HTML 構造は次のとおりです:

<div class="cont">
  <div class="slider"></div>
  <ul class="nav"></div>
  <div data-target=&#39;right&#39; class="side-nav side-nav--right"></div>
  <div data-target=&#39;left&#39; class="side-nav side-nav--left"></div>
</div>
ログイン後にコピー

以下は、jquery カルーセルのスクリーンショットの一部です。

視覚的な差分効果を備えたjQueryレスポンシブカルーセル効果

視覚的な差分効果を備えたjQueryレスポンシブカルーセル効果

上記は、視覚的な差分効果を備えた jquery レスポンシブカルーセル効果の内容です。その他の関連コンテンツについては、PHP 中国語 Web サイト (www.php.cn) にご注意ください。


関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート