0

私は非常に単純なことをしようとしています。divの高さの設定は高さによって異なります。したがって、サイトの読み込み時の高さは45ピクセルで、ボタンをクリックした後の高さは100ピクセルです。次のクリックの後、身長を45pxに戻したいです。私はjQueryを使用しています。コードは次のとおりです。http： //codepen.io/zlyfenek/pen/pAcaw jQueryを初めて使用 するので、助けてくれてありがとう。

4

5 に答える 5

1

.toggleClass()jQueryの機能を利用できます。

$(function(){
    $('.yourButton').click(function(){
       $('.yourDiv').toggleClass('big');
    });
});

デモ: http://jsfiddle.net/FYyU6/

ノート：

CSSbigクラスは small class の後に来る必要がありますOrder Matters。

于 2013-01-20T17:53:29.197 に答える
1

$("button").oneに変更$("button").on

于 2013-01-20T17:54:02.533 に答える
0 
 function showHeight(ele, h) {
$("div").text("The height for the " + ele +
" is " + h + "px.");
}
$("button").on('click', function () {

  if ($(".con_b").height() == 45)
  {
    $(".con_b").height(100);
  }
  else
  {
    $(".con_b").height(45);
  }

そうでは$("button").onない$("button").one

于 2013-01-20T17:59:56.257 に答える
0

高さを 100px に設定するクラスを作成し、ボタンをクリックしたときにそれを切り替える必要があります。

.opened { height: 100px; }

$("button").on("click", function() {
    $(".con_b").toggleClass("opened");
})
于 2013-01-20T17:53:50.817 に答える
0 
 function showHeight(ele, h) {
$("div").text("The height for the " + ele +
" is " + h + "px.");
}

// use .on instead of .one, .one will online listen for a click one time, 
// so your second click will not be seen
$("button").on('click', function () {
  if ($(".con_b").height() == 45)
  {
    $(".con_b").height(100);
  }
  else
  {
    // show height and change height should be two different actions
    $('.con_b').height(45);
    showHeight(".con_b",$(".con_b").height());
  }

 });
于 2013-01-20T17:54:01.073 に答える