网页图片轮播特效，修改成经过停止滚动，请大神指点。。。_百度知道
网页图片轮播特效，修改成经过停止滚动，请大神指点。。。
Html如下：
&div id=&guifan_konwlege&&
&div id=&carousel&&
&div&&img src=&{dede:global.cfg_templets_skin/}/images/kxzl_hd_01.jpg& width=&560& height=&342& /&&/div&
&div&&img src=&{dede:gl...
我有更好的答案
非常简单，只需要关闭和打开阀门即可。我用的jquery你自己思考一下。$(&#header_03&).mouseover(function(){m_over=});$(&#header_03&).mouseout(function(){m_over=});焦点图的mouseover事件，当鼠标悬空在焦点图框上的时候阀门m_over=false阀门关上，整个移动函数停止。焦点图的mouseout事件，当鼠标离开焦点图框的时候,阀门m_over=true阀门开启，整个移动函数开始。function zx_dog(){ if(m_over){
if(dog_i&0){dog_i=dog_}
$(&.dog_p_div&).hide();
$(&#dog_p&+dog_i).show();
$(&.btnbox img&).stop(true,true);
$(&.btnbox img&).removeClass(&img_hover&);
$(&.btnbox img&).animate({bottom:'0px'},200);
$(&#btn_img&+dog_i).addClass(&img_hover&);
$(&#btn_img&+dog_i).animate({bottom:'10px'},200);
$(&#big_imgbox&).stop();
$(&#big_imgbox&).animate({left:'-845'*dog_i+'px'});
if(dog_i&dog_count){dog_i++;}else{dog_i=0;}
} }移动焦点图的主函数。当m_over为true的时候主函数运行，焦点图轮播。
采纳率：33%
为您推荐：
其他类似问题
网页图片的相关知识
换一换
回答问题，赢新手礼包
个人、企业类
违法有害信息,请在下方选择后提交
色情、暴力
我们会通过消息、邮箱等方式尽快将举报结果通知您。网站上的图片怎么设置成首页的滚动图片_百度知道
网站上的图片怎么设置成首页的滚动图片
要把已上传的图片设置成首页的滚动式图片，是不是需要下载什么工具？（急）
我有更好的答案
一种是用上面的直接插入代码，把 &img src=&图片地址&/& 里的
图片地址改成你的图片存放地址。一种是在网站后台里的滚动图片标签插入到模版里。
在首页上需要的地方插入代码就行&marquee style=&WIDTH: 388 HEIGHT: 200px& scrollamount=&2& direction=&up& & &img src=&图片地址&/&&/marquee &
注：scrollamount为滚动速度direction为滚动方向（up向上，down向下，left向左，right向右）
可以下载来源代码 修改
按你那个直接改
不知道你后台有没有这个功能
其他1条回答
为您推荐：
其他类似问题
滚动图片的相关知识
换一换
回答问题，赢新手礼包
个人、企业类
违法有害信息,请在下方选择后提交
色情、暴力
我们会通过消息、邮箱等方式尽快将举报结果通知您。&& 有好久没来了，前段时间生病了，所以也没时间添加东西和学习，还有就是先给给我留言和回复的学友道声歉，没能及时给你们解决问题和回答，在这里深感抱歉...好了，别的就不多说了，说说最近的问题吧。
& 最近有点忙，以前没接触过网页图片的滚动效果的制作，现在要实现这个了，就临时抱抱佛脚学习了点，现在整理下，以免忘了，多多积累。现在才体会到：书到用时方恨少！好了，别的就不啰嗦了，现在整理了三个模板的滚动效果。
模板一：js动态图片滚动效果
非常平滑的JS图片滚动特效代码，无缝循环，速度可自定义，鼠标悬停时停止。它的特点是JS和图片地址分离，这样做你就经易的从数据库动态调用每张图片的地址，方便控制，因此它非常的应用。
1 &!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&
2 &html xmlns="http://www.w3.org/1999/xhtml"&
4 &meta http-equiv="Content-Type" content="text/ charset=gb2312" /&
5 &title&图片滚动&/title&
8 &style type="text/css"&
10 #demo {
11 background: #FFF;
12 overflow:
13 border: 1px dashed #CCC;
14 width: 500
16 #demo img {
17 border: 3px solid #F2F2F2;
19 #indemo {
21 width: 800%;
23 #demo1 {
26 #demo2 {
30 &/style&
31 &div id="demo"&
32 &div id="indemo"&
33 &div id="demo1"&
34 &a href="#"&&img src="/jscss/demoimg/wall_s1.jpg" border="0" /&&/a&
35 &a href="#"&&img src="/jscss/demoimg/wall_s2.jpg" border="0" /&&/a&
36 &a href="#"&&img src="/jscss/demoimg/wall_s3.jpg" border="0" /&&/a&
37 &a href="#"&&img src="/jscss/demoimg/wall_s4.jpg" border="0" /&&/a&
38 &a href="#"&&img src="/jscss/demoimg/wall_s5.jpg" border="0" /&&/a&
39 &a href="#"&&img src="/jscss/demoimg/wall_s6.jpg" border="0" /&&/a&
41 &div id="demo2"&&/div&
44 &script&
46 var speed=10;
47 var tab=document.getElementById("demo");
48 var tab1=document.getElementById("demo1");
49 var tab2=document.getElementById("demo2");
50 tab2.innerHTML=tab1.innerHTML;
51 function Marquee(){
52 if(tab2.offsetWidth-tab.scrollLeft&=0)
53 tab.scrollLeft-=tab1.offsetWidth
55 tab.scrollLeft++;
58 var MyMar=setInterval(Marquee,speed);
59 tab.onmouseover=function() {clearInterval(MyMar)};
60 tab.onmouseout=function() {MyMar=setInterval(Marquee,speed)};
62 &/script&
63 &/body&
64 &/html&
&注：var speed = 10;数越小，滚动的速度就越快。
&div id="demo2"&&/div&是必须要有的。
模板二：常用JS图片滚动（无缝、平滑、上下左右滚动）
　　本源代码收集了一些常用的网页图片滚动，无缝滚动，效果很平滑，包括上下左右四个方向的滚动，或许你现在用不上这些代码，不过先收藏起来。
1 &!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&
2 &html xmlns="http://www.w3.org/1999/xhtml"&
4 &meta http-equiv="Content-Type" content="text/ charset=gb2312" /&
5 &title&向上下左右不间断无缝滚动图片的效果(兼容火狐和IE)- www.codefans.net&/title&
8 &div id="colee" style="overflow:height:253width:410"&
9 &div id="colee1"&
10 &p&&img src="/jscss/demoimg/200907/bg3.jpg"&&/p&
11 &p&&img src="/jscss/demoimg/200907/bg3.jpg"&&/p&
12 &p&&img src="/jscss/demoimg/200907/bg3.jpg"&&/p&
13 &p&&img src="/jscss/demoimg/200907/bg3.jpg"&&/p&
14 &p&&img src="/jscss/demoimg/200907/bg3.jpg"&&/p&
15 &p&&img src="/jscss/demoimg/200907/bg3.jpg"&&/p&
16 &p&&img src="/jscss/demoimg/200907/bg3.jpg"&&/p&
17 &p&&img src="/jscss/demoimg/200907/bg3.jpg"&&/p&
18 &p&&img src="/jscss/demoimg/200907/bg3.jpg"&&/p&
20 &div id="colee2"&&/div&
22 &script&
23 var speed=30;
24 var colee2=document.getElementById("colee2");
25 var colee1=document.getElementById("colee1");
26 var colee=document.getElementById("colee");
27 colee2.innerHTML=colee1.innerHTML; //克隆colee1为colee2
28 function Marquee1(){
29 //当滚动至colee1与colee2交界时
30 if(colee2.offsetTop-colee.scrollTop&=0){
colee.scrollTop-=colee1.offsetH //colee跳到最顶端
colee.scrollTop++
36 var MyMar1=setInterval(Marquee1,speed)//设置定时器
37 //鼠标移上时清除定时器达到滚动停止的目的
38 colee.onmouseover=function() {clearInterval(MyMar1)}
39 //鼠标移开时重设定时器
40 colee.onmouseout=function(){MyMar1=setInterval(Marquee1,speed)}
41 &/script&
42 &!--向上滚动代码结束--&
44 &!--下面是向下滚动代码--&
45 &div id="colee_bottom" style="overflow:height:253width:410"&
46 &div id="colee_bottom1"&
47 &p&&img src="/jscss/demoimg/200907/bg3.jpg"&&/p&
48 &p&&img src="/jscss/demoimg/200907/bg3.jpg"&&/p&
49 &p&&img src="/jscss/demoimg/200907/bg3.jpg"&&/p&
50 &p&&img src="/jscss/demoimg/200907/bg3.jpg"&&/p&
51 &p&&img src="/jscss/demoimg/200907/bg3.jpg"&&/p&
52 &p&&img src="/jscss/demoimg/200907/bg3.jpg"&&/p&
53 &p&&img src="/jscss/demoimg/200907/bg3.jpg"&&/p&
54 &p&&img src="/jscss/demoimg/200907/bg3.jpg"&&/p&
55 &p&&img src="/jscss/demoimg/200907/bg3.jpg"&&/p&
57 &div id="colee_bottom2"&&/div&
59 &script&
60 var speed=30
61 var colee_bottom2=document.getElementById("colee_bottom2");
62 var colee_bottom1=document.getElementById("colee_bottom1");
63 var colee_bottom=document.getElementById("colee_bottom");
64 colee_bottom2.innerHTML=colee_bottom1.innerHTML
65 colee_bottom.scrollTop=colee_bottom.scrollHeight
66 function Marquee2(){
67 if(colee_bottom1.offsetTop-colee_bottom.scrollTop&=0)
68 colee_bottom.scrollTop+=colee_bottom2.offsetHeight
70 colee_bottom.scrollTop--
73 var MyMar2=setInterval(Marquee2,speed)
74 colee_bottom.onmouseover=function() {clearInterval(MyMar2)}
75 colee_bottom.onmouseout=function() {MyMar2=setInterval(Marquee2,speed)}
76 &/script&
77 &!--向下滚动代码结束--&
79 &!--下面是向左滚动代码--&
80 &div id="colee_left" style="overflow:width:500"&
81 &table cellpadding="0" cellspacing="0" border="0"&
82 &tr&&td id="colee_left1" valign="top" align="center"&
83 &table cellpadding="2" cellspacing="0" border="0"&
84 &tr align="center"&
85 &td&&p&&img src="/jscss/demoimg/200907/bg3.jpg"&&/p&&/td&
86 &td&&p&&img src="/jscss/demoimg/200907/bg3.jpg"&&/p&&/td&
87 &td&&p&&img src="/jscss/demoimg/200907/bg3.jpg"&&/p&&/td&
88 &td&&p&&img src="/jscss/demoimg/200907/bg3.jpg"&&/p&&/td&
89 &td&&p&&img src="/jscss/demoimg/200907/bg3.jpg"&&/p&&/td&
90 &td&&p&&img src="/jscss/demoimg/200907/bg3.jpg"&&/p&&/td&
91 &td&&p&&img src="/jscss/demoimg/200907/bg3.jpg"&&/p&&/td&
93 &/table&
95 &td id="colee_left2" valign="top"&&/td&
97 &/table&
99 &script&
100 //使用div时，请保证colee_left2与colee_left1是在同一行上.
101 var speed=30//速度数值越大速度越慢
102 var colee_left2=document.getElementById("colee_left2");
103 var colee_left1=document.getElementById("colee_left1");
104 var colee_left=document.getElementById("colee_left");
105 colee_left2.innerHTML=colee_left1.innerHTML
106 function Marquee3(){
107 if(colee_left2.offsetWidth-colee_left.scrollLeft&=0)//offsetWidth 是对象的可见宽度
108 colee_left.scrollLeft-=colee_left1.offsetWidth//scrollWidth 是对象的实际内容的宽，不包边线宽度
110 colee_left.scrollLeft++
113 var MyMar3=setInterval(Marquee3,speed)
114 colee_left.onmouseover=function() {clearInterval(MyMar3)}
115 colee_left.onmouseout=function() {MyMar3=setInterval(Marquee3,speed)}
116 &/script&
117 &!--向左滚动代码结束--&
119 &!--下面是向右滚动代码--&
120 &div id="colee_right" style="overflow:width:500"&
121 &table cellpadding="0" cellspacing="0" border="0"&
122 &tr&&td id="colee_right1" valign="top" align="center"&
123 &table cellpadding="2" cellspacing="0" border="0"&
124 &tr align="center"&
125 &td&&p&&img src="/jscss/demoimg/200907/bg3.jpg"&&/p&&/td&
126 &td&&p&&img src="/jscss/demoimg/200907/bg3.jpg"&&/p&&/td&
127 &td&&p&&img src="/jscss/demoimg/200907/bg3.jpg"&&/p&&/td&
128 &td&&p&&img src="/jscss/demoimg/200907/bg3.jpg"&&/p&&/td&
129 &td&&p&&img src="/jscss/demoimg/200907/bg3.jpg"&&/p&&/td&
131 &/table&
133 &td id="colee_right2" valign="top"&&/td&
135 &/table&
136 &/div&
137 &script&
138 var speed=30//速度数值越大速度越慢
139 var colee_right2=document.getElementById("colee_right2");
140 var colee_right1=document.getElementById("colee_right1");
141 var colee_right=document.getElementById("colee_right");
142 colee_right2.innerHTML=colee_right1.innerHTML
143 function Marquee4(){
144 if(colee_right.scrollLeft&=0)
145 colee_right.scrollLeft+=colee_right2.offsetWidth
147 colee_right.scrollLeft--
150 var MyMar4=setInterval(Marquee4,speed)
151 colee_right.onmouseover=function() {clearInterval(MyMar4)}
152 colee_right.onmouseout=function() {MyMar4=setInterval(Marquee4,speed)}
153 &/script&
154 &!--向右滚动代码结束--&
155 &/body&
156 &/html&
模块三：jQuery控制图片淡入淡出效果
　　Query控制图片淡入淡出效果，或许见的多了就不足为奇了，淡入淡出效果不论是在WEB或是WinForm编程中都使用广泛，很经典的一款转场或图片切换特效，在此，把基于jquery实现的图片淡入淡出效果分享给大家，希望对你的编程有帮助。
&meta http-equiv="content-type" content="text/ charset=utf-8"&
&title&jQuery控制图片淡入淡出效果&/title&
&script src="/ajaxjs/jquery1.3.2.js" type="text/javascript" charset="utf-8"&&/script&
&style type="text/css"&
ul li{position:left:50top:20}
.onoe{display:}
10 &/head&
&li&&img src="/jscss/demoimg/wall1.jpg"&&/li&
&li&&img src="/jscss/demoimg/wall2.jpg"&&/li&
&li&&img src="/jscss/demoimg/wall3.jpg"&&/li&
$(function(){
var n = 2;
setInterval(function(){
if(! $("ul li").eq(n).is(":hidden")){
$("ul li").eq(n).fadeOut("slow")
$("ul li").eq(n).fadeIn("slow")
if(n == 0){
34 &/body&
35 &/html&
就写着几个吧，其它的如果大家要用，就去网上搜吧，只是帮助自己记住这些而已，当然如果各位觉得可以就可以拿去试试。
阅读(...) 评论()其他回答(2)
这个是园友的博客，可以看看哦
Jquery插件做的事情。www.open-lib.com上去找一个即可~
园豆：35730
清除回答草稿
&&&您需要以后才能回答，未注册用户请先。赞助商推荐()：
想学到点真东西？
如果你有1~3年前端开发经验，不妨
想高薪入职阿里？
想通过真实互联网项目成长自己？}