3

スクロールバーと矢印を同時に備えたjQueryのコンテンツスライダーが必要です。このようなもの ですが、このように側面に矢印があります。親タグにカーソルを合わせると、矢印が表示されます。インターネットで検索します。しかし、必要なものが見つかりません。このようなスライダーを知っている人はいますか？

4

4 に答える 4

7

次/前のボタンが押されたときにスライダーの値を次/前のページに設定するには、 valueメソッドを使用します。これを実現するには、jQuery と UI を備えた 10 行ほどの JavaScript が必要です。

あなたが提供したリンクのスライダーに基づいて開発しました。JS コードは次のようになり、この fiddleにあります。

var max = , pageWidth = ; // see the fiddle for the full code
$('#prev, #next').click(function(){
    var current = $("#slider").slider('value');
    var to = $(this).is('#prev') ? current - pageWidth : current + pageWidth;
    $('#prev, #next').show();

    if(to <= 0)
        $('#prev').hide();
    else if(to >= max - pageWidth)
        $('#next').hide();

    $("#slider").slider('value', to);
    sliderOpts.slide(null, { value: to });
});
$('#prev').trigger('click'); // init​​​​​​​​

#prevしたがって、残っている唯一のことは、好きな CSS の変更を適用することです。また、ボタンとボタンを親要素に移動したい場合は#next、提供されたコードでも問題ありません。

于 2012-07-25T17:39:48.867 に答える
2

この例は役に立ちますか?

http://manos.malihu.gr/tuts/custom-scrollbar-plugin/scroll_buttons_and_snap_scrolling_examples.html

「ソースを表示」を試して、必要な *.js および *.css ファイルを取得し、そこから CSS とスクリプトを微調整してください。

幸運を！

于 2012-07-27T09:46:35.460 に答える
0

Jscrollpane を試す: http://jscrollpane.kelvinluck.com/

私は非常に複雑な Web サイトでこれを使用してきましたが、常に自分のやりたいことを実行することができました。また、優れたドキュメントもあります。

水平または垂直スライダー (または両方) を選択したり、矢印を表示/非表示にしたり、特定の html 要素に移動したり、アニメーションを使用したりできます。

見てみな！慣れたらずっと使えます！

それが役に立てば幸い！

于 2012-07-25T19:53:59.207 に答える
-1

まず、要件をグーグルで検索する必要があります。要件が非常に多いため、これらを確認してください

于 2012-05-15T10:24:40.273 に答える