爱站程序员基地
代码
<!DOCTYPE html><html><head><meta charset=\"UTF-8\"><title></title><link rel=\"stylesheet\" type=\"text/css\" href=\"style.css\"/><script type=\"text/javascript\" src=\"jQuery.js\"></script><script type=\"text/javascript\" src=\"carousel.js\"></script><script type=\"text/javascript\">$(function(){$(\".carousel-content\").carousel({carousel : \".carousel\",//轮播图容器indexContainer : \".img-index\",//下标容器prev : \".carousel-prev\",//左按钮next : \".carousel-next\",//右按钮timing : 2000,//自动播放间隔animateTime : 700,//动画时间autoPlay : true,//是否自动播放 true/falsedirection : \"left\",//滚动方向 right/left});$(\".carousel-content\").hover(function(){$(\".carousel-prev,.carousel-next\").fadeIn(300);},function(){$(\".carousel-prev,.carousel-next\").fadeOut(300);});$(\".carousel-prev\").hover(function(){$(this).find(\"img\").attr(\"src\",\"img/left2.png\");},function(){$(this).find(\"img\").attr(\"src\",\"img/left1.png\");});$(\".carousel-next\").hover(function(){$(this).find(\"img\").attr(\"src\",\"img/right2.png\");},function(){$(this).find(\"img\").attr(\"src\",\"img/right1.png\");});});</script></head><body><div class=\"content\"><div class=\"a-content\"><div class=\"carousel-content\"><ul class=\"carousel\"><li><img src=\"img/1.jpg\"></li><li><img src=\"img/2.jpg\"></li><li><img src=\"img/3.jpg\"></li><li><img src=\"img/4.jpg\"></li><li><img src=\"img/5.jpg\"></li></ul><ul class=\"img-index\"></ul><div class=\"carousel-prev\"><img src=\"img/left1.png\"></div><div class=\"carousel-next\"><img src=\"img/right1.png\"></div></div></div></div></body></html>
