jquery隱藏和顯示效果？

代碼：jquery隱藏和顯示效果？

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script> 
<script type="text/javascript"> 
$(document).ready(function(){ 

    $(".toggle_container").show(); 

    $("h2.trigger").click(function(){ 
     $(".toggle_container").toggle("slow"); 
     $(".container").css('width','700px'); 

    }); 

}); 
</script> 

<body> 

<div class="container"> 
<p>raesent duis vel similis usitas camur, nostrud eros opes verto epulae feugiat ad. Suscipit modo magna letalis amet et tego accumsan facilisi, meus. Vindico luptatum blandit ulciscor mos caecus praesent sed meus velit si quis lobortis praemitto, uxor. raesent duis vel similis usitas camur, nostrud eros opes verto epulae feugiat ad. Suscipit modo magna letalis amet et tego accumsan facilisi, meus. Vindico luptatum blandit ulciscor mos caecus praesent sed meus velit si quis lobortis praemitto, uxor. </p> 
</div> 

<div id="sidebar">  
    <div class="toggle_container"> 
     <div class="block"> 
     <p>Consequat te olim letalis premo ad hos olim odio olim indoles ut venio iusto. Euismod, sagaciter diam neque antehabeo blandit, jumentum transverbero luptatum. Lenis vel diam praemitto molior facilisi facilisi suscipere abico, ludus, at. Wisi suscipere nisl ad capto comis esse, autem genitus. Feugiat immitto ullamcorper hos luptatum gilvus eum. Delenit patria nunc os pneum acsi nulla magna singularis proprius autem exerci accumsan. </p><p>Praesent duis vel similis usitas camur, nostrud eros opes verto epulae feugiat ad. Suscipit modo magna letalis amet et tego accumsan facilisi, meus. Vindico luptatum blandit ulciscor mos caecus praesent sed meus velit si quis lobortis praemitto, uxor. </p> 
     </div> 
    </div> 
<h2 class="trigger"><a href="#">hide or show</a></h2> 
    </div> 
</body>

我希望在側邊欄隱藏，左邊的容器可以充滿頁面（頁面被包括left container + hide/show part) but the left container width is enlarged.時，側邊欄顯示，該頁面包括left container + sidebar + hide/show part 我的JS做代碼是無法工作的，如何糾正它。謝謝。

來源

2011-06-19 runeveryday

那麼，你需要在那裏添加某種條件語句，例如，{} else {}例如，你正在調用一個jQuery切換命令，然後硬編碼什麼動作發生，當用戶再次點擊返回到默認視圖時會發生什麼，左側邊欄會切換，再次顯示，但是您的主容器只停留在700px！

這不正是如何我會做，但這裏有一個快速的正骯髒例如::

// jQuery toggle function 
$('h2.trigger').click(function() { 

    var container = $('.container'); 

    $('.toggle_container').toggle('slow'); 

    if (container.width > 400) { 
     container.css('width', '400px'); 
    } else { 
     container.css('width', '700px'); 
    } 

});

再次，快速正骯髒，但它應該給你結果你想。

現在我已經回答了你的問題，我想指出一些事情。

1您的接受率很低。轉到您的個人資料頁面，查看您提出的問題。有人正確回答/達到您的滿意程度嗎？將他們的答案標記爲您接受的答案！這有助於社區，並鼓勵人們回答你的問題。

2儘量不要張貼巨大的大量代碼。大多數人不願意看透它。取而代之的是展示問題和相關代碼的示例中的一小塊「塊」。對於你的問題，所有的CSS都是完全不相關的，可能被排除在外。

來源

2011-06-19 03:48:01 cspray

jquery隱藏和顯示效果？

回答

相關問題