Thomas Kahn の JQuery SmoothDivScroll を使用して、タグを使用してスライドのスクロール方向を変更する 2 つの簡単なクリック可能なリンクを作成したいと考えています。右と左へのスクロール方向を両方ともクリック可能なリンクにしたいのですが、これを行う方法がわかりません。誰でも助けることができますか?
私がこれまでに持っているコードはhttp://www.festifood.nl/test.htmlにあります
ありがとう
Thomas Kahn の JQuery SmoothDivScroll を使用して、タグを使用してスライドのスクロール方向を変更する 2 つの簡単なクリック可能なリンクを作成したいと考えています。右と左へのスクロール方向を両方ともクリック可能なリンクにしたいのですが、これを行う方法がわかりません。誰でも助けることができますか?
私がこれまでに持っているコードはhttp://www.festifood.nl/test.htmlにあります
ありがとう
これがどのように機能するかです。「$(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");
});
<span id="left">left</span>
)。jQuery では、何を選択するかを説明する文字列であるセレクターを介してそれらを選択します。ID で要素を選択するには、文字列は "#" で始まり、その後に ID が続きます。セレクターを実行するには、$(selector) as $("#left") を使用します。これにより、id="left" の <span>-Tag が選択されます。$("#left").click( ... );
ます。そして、パラメータとして、<span> がクリックされたときに実行される、パラメータなしの関数を入れます。マウスオーバーイベントに反応したい場合は、.mouseover(...)
代わりに書くだけです.click(...)
また、CSS を修正し、「;」を追加する必要があります。330px の後ろ。そして「float: left;」:
#makemescrollable {
position: relative;
width: 100%;
height: 330px;
float: left;
}
以下は、コードの 1 つのタイプです。
<script type="text/javascript">
$(document).ready(function() {
$("#makeMeScrollable").smoothDivScroll({
mousewheelScrolling: true,
manualContinuousScrolling: true,
visibleHotSpotBackgrounds: "always",
autoScrollingMode: "onstart"
});
});
</script>
このリンクの下に、そのコードの外観とコーディング方法が示されています。