0

Thomas Kahn の JQuery SmoothDivScroll を使用して、タグを使用してスライドのスクロール方向を変更する 2 つの簡単なクリック可能なリンクを作成したいと考えています。右と左へのスクロール方向を両方ともクリック可能なリンクにしたいのですが、これを行う方法がわかりません。誰でも助けることができますか？

私がこれまでに持っているコードはhttp://www.festifood.nl/test.htmlにあります

ありがとう

4

2 に答える 2

0

これがどのように機能するかです。「$(document).ready(function(){」関数の最後に次を追加します。

$("#right").click(function() {
  $("#makeMeScrollable").smoothDivScroll("option","autoScrollDirection","right");
});

$("#left").click(function() {
  $("#makeMeScrollable").smoothDivScroll("option","autoScrollDirection","left");    
});

$("#backandforth").click(function() {
  $("#makeMeScrollable").smoothDivScroll("option","autoScrollDirection","backandforth");    
});

わかりました、それは何をしますか？

  1. 「左」、「右」などの ID を持つスパンを定義しました (例: <span id="left">left</span>)。jQuery では、何を選択するかを説明する文字列であるセレクターを介してそれらを選択します。ID で要素を選択するには、文字列は "#" で始まり、その後に ID が続きます。セレクターを実行するには、$(selector) as $("#left") を使用します。これにより、id="left" の <span>-Tag が選択されます。
  2. この選択された要素にクリック イベントのハンドラー関数を割り当てます。だから私たちは書き$("#left").click( ... );ます。そして、パラメータとして、<span> がクリックされたときに実行される、パラメータなしの関数を入れます。
  3. そのイベント ハンドラー関数内で、smoothDivScroll のオプションを変更します。

より詳しい情報

クリック対 OnMouseOver

マウスオーバーイベントに反応したい場合は、.mouseover(...)代わりに書くだけです.click(...)

さらに: CSS にバグがありますか?

また、CSS を修正し、「;」を追加する必要があります。330px の後ろ。そして「float: left;」:

#makemescrollable {
  position: relative;
  width: 100%;
  height: 330px;
  float: left;
}
于 2012-08-15T20:41:48.437 に答える
0

以下は、コードの 1 つのタイプです。

 <script type="text/javascript">
        $(document).ready(function() {
            $("#makeMeScrollable").smoothDivScroll({ 
                mousewheelScrolling: true,
                manualContinuousScrolling: true,
                visibleHotSpotBackgrounds: "always",
                autoScrollingMode: "onstart"
            });
        });
    </script>

このリンクの下に、そのコードの外観とコーディング方法が示されています。

http://www.smoothdivscroll.com/

于 2012-08-15T20:33:17.957 に答える