Question

如何使用相同宽度和高度的图像从左到右或从右到左连续在屏幕上移动。就像在这个页面上一样 - https://www.reddit.com/r/Nisekoi/

Answer 1

HTML：

 <img scr="myimage" id="theImage">

JavaScript的：

 var image = document.getElementById("theImage");
 var imageLeft = 0;
 function move(){
     imageLeft++;
     image.style.left = imageLeft + "px";

 }
 setInterval(move, 0);

应该工作。你是受欢迎的。

Answer 2

link用于选框示例。

<marquee>Default scrolling</marquee>

您可以提供所需数量的图像来代替＆＃34;默认滚动＆＃34;文本

Answer 3

您可以使用Marquee/css key frames/Javascript implementations进行此操作。但最简单的方法是使用marquee或css

<img class='marquee' src='http://sstatic.net/stackexchange/img/logos/so/so-logo-med.png'>

CSS

.marquee { 
  overflow: hidden;
  position: relative;
  animation: MarqueeLeft linear 18s infinite;
}

@keyframes MarqueeLeft 
{
  0% { right: -100% }
  100% { right: 100% }
}

并使用选框

<marquee direction="left">
    <img  src='http://sstatic.net/stackexchange/img/logos/so/so-logo-med.png'>
 </marquee>

检查小提琴http://jsfiddle.net/tintucraju/g9t0e3jf/1/

如何在网站上移动图片或进行连续动作？

3 个答案: