У меня есть слайдер боковой панели, который отлично работает в FF и IE. При нажатии на div боковая панель открывается; нажмите еще раз, и он вернется назад. Однако в Chrome и Safari он отлично работает в первый раз (анимированная ширина и анимированная ширина назад), но во второй раз div, который должен выдвигаться, частично появляется под нажатием клавиши div.Chrome & Safari Ошибка JQuery с анимацией и отображением/скрытием
Я создал очень простой пример проблемы. Вот JavaScript:
var slider_state = 'hidden';
function reveal_slider()
{
$('#reveal_div').animate({width:500});
slider_state = 'shown';
}
function hide_slider()
{
slider_state = 'hidden';
$('#reveal_div').animate({width:0}, function(){
$('#reveal_div').hide();
});
}
$(document).ready(function(){
$('#slider_trigger').click(function(){
if (slider_state == 'hidden')
{
reveal_slider();
}
else
{
hide_slider();
}
});
});
И CSS:
#slider_container
{
position:fixed;
top:350px;
right:0px;
z-index:21;
}
#slider_trigger
{
float:left;
width:35px;
height:100px;
background-color:yellow;
}
#reveal_div
{
float:left;
height:200px;
display:none;
background-color:blue;
border:3px black solid;
}
И HTML:
<body>
<div id='slider_container'>
<div id='slider_trigger'>
Click
</div>
<div id='reveal_div' >
</div>
</div>
</body>
Большое спасибо заранее за помощь.
JSFiddle действительно будет полезен. Есть ли причина, по которой вы не используете функциональность Toggle из любопытства? –