返回信息流* {padding : 0px;margin : 0px;font-size:16px;}
#imglist {width:573px;height:257px;overflow:hidden;border:1px #ccc solid;margin:0 auto;position:relative;}
ul {list-style:none;}
ul li {display:inline;}
#labels {position:absolute; z-index:1;left:20px;top:20px;}
#labels > li {border:1px white solid;margin:2px;padding:5px;}
.non_selected {display:none;opacity:0.2;}
//
<div id="imglist">
<ul id="imgs">
<li><img src="images/buttom_1.jpg"/></li>
<li><img src="images/buttom_2.jpg"/></li>
<li><img src="images/buttom_3.jpg"/></li>
<li><img src="images/buttom_0.jpg"/></li>
</ul>
<ul id="labels">
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
</ul>
</div>
//
$(function() { //文档加载完毕且DOM可操作时,传入的函数被调用。
var area = $('#imgs'),
timespan = 2000,
timeID;
area.hover(function() {
clearInterval(timeID);
},function() {
timeID = setInterval(function() {
var moveline = area.find('li:first');
var lineheight = moveline.height();
moveline.animate({marginTop:-[color=#FFEBCD]lineheight+'px'},1000,function() {
moveline.css('marginTop',0).appendTo(area);
});
}, timespan);
}).trigger('mouseleave');
});
我想问下在animate那块,将marginTop设置变化到负值,完成后,又将其appendTo(),这样没有删除原来的元素,而在后面加上了,为什么列表里面并没有增多?
这是一条镜像帖。来源:北邮人论坛 / www-technology / #18171同步于 2012/11/20
该镜像源已超过 30 天没有更新,可能在源站已被删除。
WWWTechnology机器人发帖
jquery marginTop问题
lyf291450708
2012/11/20镜像同步2 回复
订阅后,新回复会通过你的通知中心匿名送达。
2 条回复
【 在 lyf291450708 的大作中提到: 】
: * {padding : 0px;margin : 0px;font-size:16px;}
: #imglist {width:573px;height:257px;overflow:hidden;border:1px #ccc solid;margin:0 auto;position:relative;}
: ul {list-style:none;}
: ...................
你对moveline执行appendto()操作,实际上是“把moveline移动到了area:last的位置”。
append和appendto与其说是“插入结点”不如说是“移动节点”。
$("p:contains('hello')").appendTo(area)和$("<p>hello</p>").appendTo(area)是不一样的。
【 在 rhj1122 的大作中提到: 】
:
: 你对moveline执行appendto()操作,实际上是“把moveline移动到了area:last的位置”。
: append和appendto与其说是“插入结点”不如说是“移动节点”。
: ...................
哦,明白了,说的很详细,谢谢!