2

Drupalでサイトを構築しています。div 要素の高さを 100% と 200px の間で切り替えたい。トグル関数を試しましたが、2 つのコールバック関数をサポートしていません (この場合は混乱しています)。

div タグの高さをチェックするフラグを試してみましたが、現在の高さに従って高さを設定します。同じクラスの div タグが 3 つあり、3 つすべてでこのトグル機能が必要なため、この場合もこのアイデアは失敗します。

また、高さを 100% に変更するとイージング効果なしで発生し、高さを 200px に変更するとイージング効果が機能します。

4

1 に答える 1

1

HTML :

<div class="target"> Hi </div>
<div class="target"> Hi 2</div>
<div class="target"> Hi 3</div>
<a href="#" id="button">Button</a>

CSS :

.target {
    width: 100px;

}
.someClass {
    background: #f00;
}

Jクエリ:

$("#button").click(function(){
    $("div.target").toggleClass("someClass",100);
    return false;
});

それがあなたにとって十分でない場合は、イージング効果のあるこれをチェックしてください: http://jsfiddle.net/6FwUf/4/

EDIT:私はあなたのコードを変更しました、これをやってみてください:

$("a.artist-page-read-more").toggle(
     function() {
         $(this).parents("div.panel-pane").siblings("div.panel-pane.pane-entity-field").find("div.field-items").animate({height: "100%"}, "slow");
     },
    function(){
         $(this).parents("div.panel-pane").siblings("div.panel-pane.pane-entity-field").find("div.field-items").animate({height: "200px"}, "slow");
       }   
   ); 
于 2012-04-27T06:27:52.560 に答える