我在尝试连续生成10个小方块(每1秒)以模拟加载栏中的像素,同时让它们出现在兔子的另一幅图像下面时遇到了困难。现在它正在工作,但是它们似乎形成一条垂直线而不是一行。
这是javascript代码:
var rabbit = document.getElementById("rabbit");
for(var i=0; i < 10; i++){
setTimeout(() => {
var pixel = document.createElement('img');
pixel.setAttribute('src', 'static/images/test/pixel.png');
pixel.setAttribute('height', '10px');
pixel.style.marginLeft = "10px";
document.body.appendChild(pixel);
rabbit.after(pixel);
}, i*1000+1500);
}
这是兔子图片的HTML标签:
<img id='rabbit' src='{% static 'images/cartelera_home/ghost.gif' %}' alt='' style='height:0px'>
我认为这无关紧要,但是我正在使用Django构建此网站并进行引导,到目前为止,此页面中没有CSS代码。
只是任何形式的帮助将得到高度赞赏。
我在尝试连续生成10个小方块(每1秒)以模拟加载栏中的像素,同时让它们出现在兔子的另一幅图像下面时遇到了困难。现在它正在工作,但是它们似乎形成一条垂直线而不是一行。
除非我误解了,否则这似乎正在按您的预期进行。它看起来像进度条-我只是使用数据uri用蓝色框替换了您的代码。
您可以在这里看到它https://codesandbox.io/s/peaceful-wilbur-d2tuf?file=/index.html'
您是否可能有其他代码/样式干扰结果?
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句