我差不多在这个网站上创建了滑动标签:http://www.imaginationmuzic.com,最后一步是右侧滑动标签未正确滑动。正如您在开始打开后看到的那样,在一次点击后进一步打开并且似乎在第3次之后关闭但是真正使网站更宽,允许用户滚动以隐藏它...
这是我的代码:
CSS
#panel2{
height:500px;
width:200px;
background-color:#333;
}
#contact2{
position:relative;
top:-400px;
right:40px;
width:40px;
height:168px;
background:url(/images/twitter-panel.png);
}
#container2{
position:relative;
right:0px;
z-index:5;
position:absolute;
top:110px;
}
的Javascript
script type="text/javascript">
$(document).ready(function(){
var pos='in';
$("#contact2").click(function(){
if(pos=='in'){
$("#container2").animate({right:'200px'
});
pos='out';
}
else
{
$("#container2").animate({right:'-200px'
});
pos='in';
}
});
});
</script>
和HTML:
<div id="container2">
<div id="panel2"></div>
<div id="contact2"> </div>
</div>
感谢能够提供帮助的任何人!
答案 0 :(得分:0)
如果您希望它回到原始位置,您想要动画回right: '0'
而不是right: '-200px'
。
或者您可以将overflow-x: hidden;
添加到正文以停止滚动。
<强> CSS 强>
body {
overflow-x: hidden;
}