2013-07-03 2 views
0

Я использую jQuery .toggle, чтобы показать и скрыть div. Я настроил его так, что когда он впервые переключает фон кнопки, которую пользователь нажимает на изменение цвета. То, что я хотел бы сделать, это восстановить цвет фона кнопки, когда пользователь снова нажимает кнопку, чтобы показать div. Может ли кто-нибудь помочь?Восстановление значения CSS после jQuery toggle

спасибо :-)

Вот что я до сих пор ...

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 
<title>Untitled Document</title> 
<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script> 
</head> 

<body> 

<script> 
$(document).ready(function(){ 
    $("#billboardButton").click(function() { 
     $("#billboard").toggle("slow", function() { 
      $("#billboardButton").css("backgroundColor", "#333"); 
     }); 
    }); 
}); // End document ready 
</script> 

<style> 
#billboardButton { 
background-color:#f1f1f1; 
color:#666; 
padding:3px; 
width:100px; 
cursor:pointer; 
text-align:center; 
margin:0 auto; 
} 


</style> 

<div id="test" style="width:970px;margin:20px auto;"> 
<div> 
<div id="billboardButton">Close Ad</div> 
</div> 
<div id='billboard' style='width:970px; height:250px;background-color:#0C9;'> 
</div> 
</div> 



</body> 
</html> 

ответ

1

Я могу видеть, что ваш первоначальный цвет фона в CSS-файлов, так что вы можете просто сделать это:

$("#billboardButton").css("backgroundColor", $(this).is(':not(:visible)') ? "#333" : ""); 

Смотрите результат: http://jsbin.com/ahatin/1

+0

не будет работать, он должен использовать *** $ ('# billboard'). Is (': not (: visible)') ***, потому что он не переключает сама кнопку ... так или иначе + 1, это довольно элегантно, тогда мое решение –

+0

@MarvinEmilBrach '$ (this)' is '# billboard', так как вы находитесь в функции обратного вызова для переключения. –

+0

OUCH! дерьмо, я сожалею, что я такой же идиот :) –

0

Создать учетную CLA Дополнительно дворец ss (например, кнопкаPressedFirst). Теперь, когда переключая:

if($("#billboardButton").hasClass('buttonPressedFirst')) { 
    $("#billboardButton").removeClass('buttonPressedFirst') 
} else { 
    $("#billboardButton").addClass('buttonPressedFirst') 
} 
0

Создать класс othercolor

.othercolor {

background-color:#333; 

}

$ (документ) .ready (функция() {

$("#billboardButton").click(function() { 

    $(this).toggleClass("othercolor"); 

}); 

});

Смежные вопросы