0

クリック要素に応じて 3 つの異なる高さにアニメーション化したい div があります。私はクラスでそれをやりたかったので、クリックされた要素の1つであるd_foxboroという名前のdivがクリックされ、height_oneのクラスがある場合、location_sliderは最初の高さにアニメーション化され、別のdivがクリックされた場合、d_mainがあり、クラスが height_two の場合、location_slider は 2 番目の高さにアニメーション化されます。

$( "#d_Foxboro" ).click(function(){
$( "#location_slider" ).animate({
"height": 500
}, 450 );
});
4

3 に答える 3

2 
$( "#d_Foxboro" ).click(function(){
    var height = 0;
    if($(this).hasClass('class1')){ 
       height = 400; 
   } else if($(this).hasClass('class2')){ 
       height = 500; 
   } else if($(this).hasClass('class3')){ 
       height = 600; 
   }

   $( "#location_slider" ).animate({
       "height": height
   }, 450 );

});

基本的に、 hasClass を使用して要素のクラスを確認し、クラスに応じて高さを含む変数を設定します

于 2012-10-29T16:02:48.157 に答える
0

個人的に.on()は、要素が DOM に動的に追加された場合に簡単に変更できるため、このメソッドをイベントのバインドに使用するのが好きです。

$( "#d_Foxboro" ).on("click", function(){
    var height = 0;
    if ($(this).hasClass() == "someClass"){
        height = 100;
    }
    else
    {
        height = 200;           
     }
    $( "#location_slider" ).animate({
         "height": height
       }, 450 );
});
于 2012-10-29T16:02:46.147 に答える
0

クリックしてクラスを確認し、それに基づいて高さ変数を設定します

$( "#d_Foxboro" ).click(function(){
  // Default height
  var h = 0; // Set to a default number
  // Class of clicked item
  var h_class = $(this).attr('class');

  // Check class and set height based of which class
  if(h_class == "something") {
    h = 500;
  } else if(h_class == "something else") {
    h = 400
  }

  $( "#location_slider" ).animate({
    "height": h
  }, 450 );

});
于 2012-10-29T16:04:28.793 に答える