Rhinoslider：最も柔軟なjQueryスライダー

Rhinoslider：柔軟で使いやすいjQueryスライドプラグイン

Rhinofaderのことを聞いたことがあるかもしれません。数週間前、その開発者は「アップグレードされたバージョン」-Rhinosliderをリリースしました。 Rhinosliderは、現在最も柔軟なJQueryスライダープラグインです。私たちは、プログラミングエクスペリエンスがなくても簡単に開始できる使いやすいスライドを作成し、可能な限り高度にカスタマイズ可能にすることを目指しています。チュートリアルとドキュメントAPIを提供して、独自のエフェクト、スタイル、機能を簡単に作成できるようにします。

Rhinosliderの最大の部分は、そのオンラインデモンストレーションです。私たちのジェネレーターは、スライダーの可能性をテストできるツールを提供します。各設定はクリックして編集可能であるため、コードを書くことなく、必要に応じて設定できます。すべての設定を実行したら、エフェクトを選択してスライダーをダウンロードしてください。必要のない効果は必要ありません。

サイロスライダーの使いやすさは印象的です。 http://rhinoslider.com/demo-download/にアクセスして、発電機の便利な操作を体験してください。

著者はじめに

• renémaas：
• Sebastian Pontow：

rhinoslider faq

サイロスライダーの遷移効果をカスタマイズする方法は？

Rhinosliderは、さまざまなカスタマイズ可能な遷移効果を提供します。 Rhinoslider関数の「効果」オプションを変更する必要があります。たとえば、「スライド」効果を使用するには、これを書くことができます。 「フェード」、「キック」、「プッシュ」、「スライド」、「登山」など、さまざまな効果から選択できます。

$('#slider').rhinoslider({effect: 'slide'})Rhinosliderはレスポンシブデザインをサポートしていますか？

はい、Rhinosliderはレスポンシブデザインを完全にサポートし、任意の画面サイズに適合させることができます。画像とスライダー自体を自動的に変更して画面に合わせて、レスポンシブWebデザインに最適です。

Rhinoslider's Slideにタイトルを追加するにはどうすればよいですか？

各スライド内に「キャプション」クラスを備えた「div」要素が含まれており、テキストはタイトルとして使用されます。たとえば、

これはタイトル<div> <img src="/static/imghwm/default1.png" data-src="https://img.php.cn/upload/article/000/000/000/174070220498109.jpg?x-oss-process=image/resize,p_40" class="lazy" alt="Rhinoslider: The most flexible jQuery slider ">です。 <p><strong>他のjQueryプラグインでは、Rhinosliderを使用できますか？ </strong></p> <p>はい、ただし、プラグイン間に競合がないことを確認してください。競合がある場合は、jQueryの<code> noconflict<code>noConflictメソッドを使用して解決できます。

サイロスライダーの遷移速度を変更する方法は？

Rhinoslider関数の「EffectsPeed」オプションを使用して、遷移速度を調整します。値はミリ秒単位です。たとえば、2秒の移行時間で、次のように書くことができます： $（ '＃slider'）。Rhinoslider（{EffectSpeed：2000}）<code>$('#slider').rhinoslider({effectSpeed: 2000})。

Rhinosliderはフルスクリーンの背景スライダーを作成できますか？

はい、スライダーの幅と高さを100％に設定し、画面全体をカバーするように絶対に配置します。

Rhinosliderにナビゲーションコントロールを追加する方法は？

Rhinosliderビルトインナビゲーションコントロールは、「ControlsPlayPause」、「ControlSprevNext」、および「ControlSseyboard」オプションをTrueに設定することで有効にできます。

Rhinosliderはカルーセルスライダーを作成できますか？

はい、「効果」オプションを「カルーセル」に設定し、「アイテム」オプションを調整して、目に見えるアイテムの数を指定します。

Rhinosliderにタイマーを追加する方法は？

「showtime」オプションを設定して、次のスライド前の残りの時間を示します。

Rhinosliderはビデオスライダーを作成できますか？

はい、各スライド内に「ビデオ」要素を含め、「自動再生」オプションをfalseに設定して、ビデオが再生されたときにスライドが自動的に切り替わるのを防ぎます。