日期:2014-05-17  浏览次数:20493 次

求人给一个很简单的点击换图片代码
很简单 
比如 有10张图片
首页显示5张图片 大小 W= 170 H=160
左边和右边分别有一个按钮.图片按钮 一个箭头
点击左边的 图片就往左边移动一个 显示第六张图片 点击右边 就往有 显示XX...
很多电影网都用过这个图片的..一时想不出来怎么说l.e..总之很简单.很多网站都有这种样子的代码
以前见过很多 现在急要...忽然招不到了...
希望有高手有的话 贴个代码

------解决方案--------------------
有现成的插件

参考下
http://www.zhangxinxu.com/jq/jcarousel_zh/
------解决方案--------------------
function tabImg(dir) {
var num = $(".logoImg img").length-1;//有多少张图片
var hot = $(".count").children("."+dir);//被点击的按钮
var logoImg = $(".logoImg");
var imgWidth = $(".logoImg img:first").outerWidth() + 6;//得到每张图片的宽度
var marginLeft = logoImg.css("margin-left");//得到距离左边的位置
if(dir == "left"){
if(Math.abs(parseInt(marginLeft,10)) < parseInt(imgWidth,10)*num){
logoImg.animate({"margin-left":parseInt(marginLeft,10) - parseInt(imgWidth,10)},1000);
var countHover = $(".countHover");
$(".count span").removeClass("countHover");
countHover.next("span").not(".left").addClass("countHover");
}
}else if(dir == "right") {
if(Math.abs(parseInt(marginLeft,10)) >= parseInt(imgWidth,10) &&
Math.abs(parseInt(marginLeft,10)) <= parseInt(imgWidth,10)*num ){
logoImg.animate({"margin-left":parseInt(marginLeft,10) + parseInt(imgWidth,10)},1000);
var countHover = $(".countHover");
$(".count span").removeClass("countHover");
countHover.prev("span").not(".right").addClass("countHover");
}
}
}
------解决方案--------------------
不明白的 可以给我发站内邮件
------解决方案--------------------
在网上找个觉得可以的例子,看source code把相关的js、css都copy过去研究研究。