2

ここに画像の説明を入力してください

私はこのメニューをulli構造で持っています。オーバーフロー時に非表示のボタンがあります:非表示。非表示のコンテンツを次の前のボタンでスライドできるようにしたい。しかし、ボタンのサイズが違うので、これを安全に外す方法は考えられません。

助けていただければ幸いです。

jqueryプラグインへのいくつかのポインタも。

ありがとう。

htmlはここにあります:http://jsfiddle.net/utKqe/2/

私はこれで望ましい効果を得ることができました(しかし、それでも無限に行くのを止めることはできません):

    //other category page, navigate through cats
$(document).ready(function() {

    $('#otherleftarrow').click(function() {
        $('#othermenu ul').animate({marginLeft: '-=100px'}, 200);
        return false; // prevent default click action from happening!
    });

    $('#otherrighttarrow').click(function() {
        $('#othermenu ul').animate({marginLeft: '+=100px'}, 200);
        return false;
    });

});
4

2 に答える 2

0

各li要素のoffsetXを含むリストを保持し、現在のオフセット(最初は0)を常に覚えておいてください。「next」を押すと、ul構造全体が-offsetXArray [nextElement]にスライドし、同様に、「prev」を押すと、-offsetXArray[prevElement]にスライドします。

于 2012-04-21T22:47:13.000 に答える
0

jQueryを使用すると、計算された(実際に表示された)要素の幅にアクセスできるため、これを使用してナビゲーションulの左オフセットを変更し、以前に非表示にしたボタンを表示できます。

できるだけ早くドキュメントへのリンクを取得します。

編集:それは:http width()//api.jquery.com/width/

編集:多分これはあなたがそれをどのように使うことができるかについての考えを与えるかもしれません:

$('#otherleftarrow').click(function() {
    var menu = $('#othermenu ul');
    menu.css(
        'marginLeft', 
        (menu.offset().left + $('.catotherselected').parent().prev().width()) + 'px'
    );
});

無限スクロールを防ぐには:ifsを追加してmenu.offset> = 0(右矢印)に対してテストします。左矢印の場合、menu.offset <0に対してテストする必要があります-(menu.width-[表示されるビットの幅。#othermenu-矢印の幅である必要があります])

于 2012-04-21T22:48:09.443 に答える