0

http://mehdi.biz/blog/2010/02/05/vertical-tabs-for-jquery-lovers/から 参照

私はそれが非常に簡単であることを知っていますが、解決策を見つけることができませんでした..ユーザーがそのアイコンからマウスを離したときにパネル(コンテンツ)を非表示にしたいだけです. .)

そのjqueryコードを追加するにはどうすればよいですか?

var $items3 = $('#vtab>ul>li');
$items3.mouseleave(function()
        {                           
        $('#vtab>div').hide();  
        }).mouseleave();

そのコードを試してみました..タブが非表示になるため、パネルのコンテンツにアクセスできません..

例: http://arkansas.gov/ 右側のパネル

4

1 に答える 1

0

アタッチした直後にマウスリーブをトリガーしています。なんで?垂直タブの javascript の代わりに、これを使用します: cssに追加display: none;します。#vtab > div

    var $items = $('#vtab>ul>li');
    var $contents = $('#vtab>div');
    $items.on('mouseenter', function() {
        $items.removeClass('selected');
        $(this).addClass('selected');
        $contents.hide();
        var index = $items.index($(this));
        $contents.eq(index).show();
    });
    $('#vtab').on('mouseleave', function(){
        $items.removeClass('selected');
        $contents.hide();
    });

ここで試してみてください。これにより、タブのコンテンツのみが表示され、mouseenter でタブが選択され、コンテンツが非表示になり、mouseleave でタブが選択解除されます。

于 2012-04-16T14:41:43.320 に答える