dw在php图片滑动切换效果,超简单的图片左右切换滑动

网上看过很多图片左右切换滑动的效果，不过大都是使用插件实现。插件虽方便，但是对于新手的学习并不是最好的。本文使用jquery这个由原生的JavaScript封装的库，用最简短的代码实现此功能

效果预览如下图：

image

代码部分(直接复制代码便可使用，注意对应的图片路径改成自己的图片路径，图片大小建议300*300)

超简单的图片左右切换滑动

var cot=0;//设置一个计数器，初始值为0；作用是用来监听点击切换的时候哪一个图片应该隐藏或者显示

function nex(){

if(cot<=2){

$('.imgs img').eq(cot).animate({'margin-left':'-305px'},500);

cot++;

}

}

function pre(){

if(cot>0){

cot--;

$('.imgs img').eq(cot).animate({'margin-left':'0'},500);

}

}

上一页

下一页