我想动态创建div,将它们附加到正文并设置jQuery动画。
这是创建元素的地方:
function drawSpot()
{
var myH1 = document.createElement("div");
myH1.style.position = "absolute";
myH1.style.top = GetRandom(0,100)+"%";
myH1.style.left = GetRandom(0,100)+"%";
myH1.style.width="40px";
myH1.style.height="40px";
$("body").append(myH1);
}
从他们附加到身体的那一刻起,我想开始动画。
答案 0 :(得分:7)
如果你已经在使用jQuery,那么你应该一直这样做:
$('<div>', {
css: {
position: 'absolute',
top: GetRandom(0,100)+'%',
left: GetRandom(0,100)+'%',
width: '40px',
height: '40px'
}
}).appendTo( document.body ).animate({
left: '100%' // for instance
}, 2000);
通过使用.appendTo()
,您仍然可以引用原始对象,并能够在其上链接方法。
答案 1 :(得分:1)
使用jQuery创建元素,并在追加时为其设置动画:
function drawSpot() {
var myH1 = $("<div>").css({ position: "absolute",
top: GetRandom(0,100)+"%",
left: GetRandom(0,100)+"%",
width: 40,
height: 40 });
$("body").append(myH1.animate(...));
}
答案 2 :(得分:1)
那应该有用
function drawSpot()
{
var myH1 = '<div id="newDiv">Some Text</div>';
$("body").append(myH1);
$("#newDiv").css({'position' : 'absolute',
'top' : GetRandom(0,100)+"%",
'left' :GetRandom(0,100)+"%",
'width':'40px',
'height':'40px'
});
$("#newDiv").hide().fadeIn(500);
}
答案 3 :(得分:1)
您可以在$(myH1).animate({left:'*randomvalue*', top:'*randomvalue*'},1000);
之后使用:append
。