Смена текста в ссылке
Нашел скрипт выдвижной панели
$(document).ready(function(){
$(".btn-slide").click(function(){
$("#cartbody").slideToggle("slow");
$(this).toggleClass("active");
return false;
});
});
<div class="slide"> <a href="#" class="btn-slide">Показать</a> </div> в ней все устраивает кроме одного не меняется там текст показать/скрыть. Побывал сделать так:
$(document).ready(function(){
$(".btn-slide").click(function(){
$("#cartbody").slideToggle("slow");
$(this).toggleClass("active");
$(this).html("Скрыть");
return false;
});
});
Текст Скрыть проявляется, но потом не убирается как узнать когда панель скрыта, а когда нет? и менять в ссылке текст |
Вот один из возможных вариантов (далеко не единственный возможный):
<style type="text/css">
.hidden { display:none; }
</style>
$(document).ready(function(){
$(".btn-slide").click(function(){
$("span", this).toggleClass("hidden");
$("#cartbody").slideToggle("slow");
$(this).toggleClass("active");
return false;
});
});
<a href="#" class="btn-slide"><span>Скрыть</span><span class="hidden">Показать</span></a> |
Спасибо, работает но хотелось бы обойтись без SPANов
|
Ну есть же и другие варианты. Например,
$(document).ready(function(){
$(".btn-slide").click(function(){
$("#cartbody").slideToggle("slow", function() {
$(".btn-slide").text(($("#cartbody:visible").length==0) ? "Показать" : "Скрыть");
});
$(this).toggleClass("active");
return false;
});
});
--- Или так:
$(document).ready(function(){
$(".btn-slide").click(function(){
$(this).text(($("#cartbody:visible").length==0) ? "Скрыть" : "Показать");
$("#cartbody").slideToggle("slow");
$(this).toggleClass("active");
return false;
});
});
|
Еще раз спасибо!
|
| Часовой пояс GMT +3, время: 14:35. |