用html5开发前端app，触摸图片会滑动到下一张图片，请问怎么弄？

这个原理其实很简单的。知道html5只是html+css3+js的全程，所以控制图片的定位都是有css的一个position属性来做的，图片无非就是去改变定位中的left值。知道这个之后就可以接下来的实现步骤：当然，这些只是实现逻辑。具体细化功能这个自己去调整。原理知道其他的都简单的很。

第一步：将N张图片去排版定位。

第二步：现在已经知道了这3张图片的位置，接下来就是去点击它，改变他的位置，这个点击其实用js就很容易实现。onclick点击事件，可以搜下；

第三步:图片就这样切换了。假设手机屏幕宽是50像素的，现实不是这样，所以需要加个遮照。就是在这个滚动的图片上再加一层div去遮住不去显示的图片（当然这是一种蔗照方法）。

方案一：直接使用HTML的滚动标签 marquee ，把图片放入滚滚标签内部，代码如下：

<marquee>

<img src='1.jpg'>

<img src='2.jpg'>

<img src='3.jpg'>

<img src='4.jpg'>

</marquee>

方案二：使用第三方插件，比如swiper.js，

插件

在html中需要将插入的图片左右来回移动，只需要在图片img标签外套一个marquee标签，在里面写上behavior=alternate这句话就可以实现。\x0d\x0a alternate是滚动标签的属性。\x0d\x0ascrolldelay，滚动延时，用于设定两次滚动 *** 作之间的间隔时间，该时间以毫秒为单位。\x0d\x0abehavior，滚动方式。\x0d\x0a\x0d\x0aalternate： 表示在两端之间来回滚动。\x0d\x0ascroll： 表示由一端滚动到另一端，会重复。\x0d\x0aslide： 表示由一端滚动到另一端，不会重复

---