Question

使用Jquery的animate动画不正常

html代码
<div class="Error" onmouseover="javascript:ColseShow();" onmouseout="javascript:ColseHide();">
<ul>
<li id="li_Error" style="width:100%;"><div id="Error" ></div></li>
<li id="li_Close" style="width:0%;"><div id="Close" >关闭</div></li>
</ul>
</div>
Jquery代码
function ColseShow() {
$("#li_Error").stop().animate({ width: '80%' });
$("#li_Close").stop().animate({ width: '20%' });
}
function ColseHide() {
$("#li_Close").stop().animate({ width: '0%' });
$("#li_Error").stop().animate({ width: '100%' });

}
这是打开的时候是正常的

当鼠标移开的时候第二个li换行了

一直都是换行状态

white-space:nowrap;这个属性我已经在CSS里添加了
我的问题是：效果类似于手机上向左划出现隐藏按钮

那么这个按钮应该要和前面红色的消息框在同一行
现在就是在展开这个按钮的时候是在同一行
隐藏的时候这个按钮自动跑到第二行了





Answer 1

停止所有在指定元素上正在运行的动画。
如果队列中有等待执行的动画(并且clearQueue没有设为true)，他们将被马上执行
clearQueue(Boolean):如果设置成true，则清空队列。可以立即结束动画。
gotoEnd (Boolean):让当前正在执行的动画立即完成，并且重设show和hide的原始样式，调用回调函数等。
点击Go之后开始动画,点Stop之后会在当前位置停下来:
复制代码 代码如下:
// 开始动画 $("#go").click(function(){ $(".block").animate({left: '+200px'}, 5000); }); // 当点击按钮后停止动画 $("#stop").click(function(){ $(".block").stop(); }

追问

动画我会
我现在的问题是动画不正常
两个div是在同一行的
但在播放动画的时候错行了

追答

你好!请试一下,在你写下一个DIV的时侯清除右浮动(clear:right)，
看有没有效果。祝你成功!