1

要素がクリックされたときにナビゲーションブロックをスライドさせ、同じ要素がクリックされた場合にナビゲーションブロックを非表示にする正しい方法、またはそれ以上のクリーンで正確な方法を見つけようとしています。これは私がこれまでに持っているものです:

$('.menu').click(function(e) {

    e.preventDefault();

    $('#pic-slideNav').css('display', 'block');

    if ($.browser.webkit) {
        $('#pic-wrapper').css('-webkit-transform', 'translate(250px,0px)');
        console.log('This is Chrome');
    } else {
        $('#pic-wrapper').css('transform', 'translate(250px,0px)');
        console.log('This is Everything else');

    }
});

正しい CSS ルールを渡すことができるように、ブラウザーの種類も確認しています。

私のために働いている更新されたコード:

$('.menu-icon').click(function(e) {

    e.preventDefault();

    if($('#pic-slideNav').is(':visible')) {
        $('#pic-slideNav').hide();
        if ($.browser.webkit) {
            $('#pic-wrapper').css('-webkit-transform', 'translate(0px,0px)');
            console.log('This is Chrome');
        } else {
            $('#pic-wrapper').css('transform', 'translate(0px,0px)');
            console.log('This is Everything else');
        }

    } else {
        $('#pic-slideNav').show();
        if ($.browser.webkit) {
            $('#pic-wrapper').css('-webkit-transform', 'translate(250px,0px)');
            console.log('This is Chrome');
        } else {
            $('#pic-wrapper').css('transform', 'translate(250px,0px)');
            console.log('This is Everything else');
        }
    }

});

これを達成するためのよりクリーンな方法があると確信していますが、うまくいきます。

4

1 に答える 1

2

このようなものをお探しですか

var i=0;
jQuery("#btn").click(function() {
    var t = (Math.pow(-1,i))*160;
    jQuery("#id").stop(true, false).animate({
        left: t
    }, 500);
    i = (i>10) ? 0 : (i+1);
});​
于 2012-12-29T21:19:14.030 に答える