0

私のサイトには、クリック時に他の要素の css を変更する jquery を持つボタンがあります。

ボタンが2回クリックされたときにcssの変更を元に戻す別の機能を割り当てたいと思います。

$('.mobileitem').click(function(){
   $('.bottomfooter').css("bottom","75px");
   $('#mobilefoot').css("display", "block");
});

.mobileitemもう一度クリックして、それぞれの要素の css を bottom:0 display:none に変更できるようにしたいと考えています。

.mobileitem をクリックするたびに、2 つの間を移動する必要があります。

.toggle() だと思いますが、適切な構文がわからない、またはより良い方法があるかどうか

4

5 に答える 5

2 
$('.mobileitem').click(function(){
   var bot_val="75px";
   var dis_val="block";
   if($('.bottomfooter').css("bottom")==bot_val){
       bot_val="0px";
   }
   if($('#mobilefoot').css("display")==dis_val){
       dis_val="none";
   }
   $('.bottomfooter').css("bottom", bot_val);
   $('#mobilefoot').css("display", dis_val);
});

これはうまくいくはずです！

于 2013-05-06T10:43:42.353 に答える
1

これを試してください

function toggleClickEvents(item, click1, click2){
    $(item).off('click').on('click', function(){
        click1();
        toggleClickEvents(item, click2, click1);
    });
}

または、単に.toggle()を使用しますが、非推奨で削除される可能性があります。（交換品は不明）

于 2013-05-06T10:53:06.303 に答える
0 
$('.mobileitem').toggle(function(){
   $('.bottomfooter').css("bottom","75px");
   $('#mobilefoot').css("display", "block");
}, function(){
   $('.bottomfooter').css("bottom","0px");
   $('#mobilefoot').css("display", "none");
});

これは、TOGGLE 機能を使用した、より簡潔でわかりやすい例です。それもうまくいきます。:)

于 2013-05-06T10:53:05.067 に答える
0

あなたは2つのCSSクラスを書くことができます

.bottom75
{
  bottom: 75px;
  display: block;
}

.bottom0
{
  bottom: 0px;
  display: none;
}

オンクリックイベント

$('.mobileitem').click(function(){
  $(this).hasClass('bottom75') ? $(this).addClass('bottom0'): $(this).addClass('bottom75');
});
于 2013-05-06T10:53:58.153 に答える