подскажите скрипт для сворачивания текста

[tsigel]

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"></script>
<style>
#spoiler {
 overflow: hidden;
 height: 30px;
 line-height: 15px;
}
#spoiler.active {
 height: auto;
}
</style>
<div id="spoiler">
немного параметров<br>
еще чуть-чуть параметров<br>
больше параметров<br>
еще больше параметров<br>
намного больше параметров<br>
</div>
<button>больше параметров</button>
    <script>
      $("button").click(function () {
      if ($("#spoiler").css("height") == "30px") {  
         var height = $("#spoiler").css("height", "auto").height();
         $("#spoiler").css("height", "30px")
         $("#spoiler").animate({"height": height});
     } else {
         $("#spoiler").animate({"height": "30px"});
     }
});
    </script>

[frenzy]

Что-то не работает. Файрбаг показывает, что var height = $("#spoiler").css("height", "auto").height(); выполняется и всё, но в итоге ничего не меняется и всегда выполянется только первое условие
А нет просто стандартной функции, которая могла бы перерендерить страницу после изменения height? Анимация мне не так важна.

[tsigel]

location.reload()

[frenzy]

Разобрался, что-то с условным переходом не то.
Если поставить $("#spoiler").css("height") != "auto", то анимация происходит развертка, но сворачиваться не хочет. В JS точно можно просто так взять и сравнить строки?
Поалертал. В общем округлять как-то нужно, ибо alert($("#jshop_unijax_filter").css("height")); выдает 500.5164px,(в css 500px)

[tsigel]

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"></script>
<style>
#spoiler {
 overflow: hidden;
 height: 30px;
 line-height: 15px;
}
#spoiler.active {
 height: auto;
}
</style>
<div id="spoiler">
немного параметров<br>
еще чуть-чуть параметров<br>
больше параметров<br>
еще больше параметров<br>
намного больше параметров<br>
</div>
<button>больше параметров</button>
    <script>
    (function () {
      var flag = true;

    $("button").click(function () {
      if (flag) {  
         var height = $("#spoiler").css("height", "auto").height();
         $("#spoiler").css("height", "30px")
         $("#spoiler").animate({"height": height});
     } else {
         $("#spoiler").animate({"height": "30px"});
     }

flag = !flag;

});

   })()      
    </script>

[рони]

$("#spoiler").css("height") != "auto"

это условие будет всегдачаще всего истинно

[tsigel]

Строки сравнивать можно.
Если не важна анимация можно писать вместо

$("#spoiler").animate({"height": height});

вот так

$("#spoiler").css("height", "30px");
$("#spoiler").css("height", "auto");

[рони]

Если не важна анимация можно

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"></script>
<style>
#spoiler {
 overflow: hidden;
 height: 30px;
 line-height: 15px;
}
#spoiler.active {
 height: auto;
}
</style>
<div id="spoiler">
немного параметров<br>
еще чуть-чуть параметров<br>
больше параметров<br>
еще больше параметров<br>
намного больше параметров<br>
</div>
<button>больше параметров</button>
    <script>
    	(function ()
    	  {
    	    var flag = true;
    	    $("button").click(function ()
    	      {$("#spoiler").toggleClass('active')
    	      }
    	    )
    	  }
    	)()
    </script>

[frenzy]

tsigel
27 $("#spoiler").css("height", "30px") - что делает эта строчка вообще и почему нет ; изначально? Ибо я убераю и ничего не происходит.

Вообще ПОЧТИ.

(function($){
	  
	  var collapsed = false;
	  $("#showmore").click(function () {
	  alert($("#jshop_unijax_filter").css("height"));
	  if (collapsed == 0) {  
		 collapsed = true;
		 var height = $("#jshop_unijax_filter").css("height", "auto").height();
		 $("#jshop_unijax_filter").animate({"height": height});
	 } else {
		 $("#jshop_unijax_filter").animate({"height": "500px"});}
		 collapsed = false;
		 })
	  
	  })(jQuery)

Вот только collapsed на true почему-то не меняется вообще. Уж не с локальностью переменных ли проблемы?

[tsigel]

if (collapsed == 0) {

должно быть

if (collapsed) {