JS幻灯点击鼠标停止，离开鼠标继续，
下面的JS幻灯点击数字仍然不停止播放，如何改一下代码能够点击停止，离开鼠标后继续播放呢？<title></title><styletype="text/css"><!--...
下面的JS幻灯点击数字仍然不停止播放，如何改一下代码能够点击停止，离开鼠标后继续播放呢？
<title></title>
<style type="text/css">
<!--
#Slide_Focus {
filter: progid:dximagetransform.microsoft.fade ( duration=0.5,overlap=1.0 );
overflow: hidden;
height: 104px;
position: relative;
width: 503px;
}
#Slide_Focus IMG {
height: 104px;
width: 503px;
}
#f_Slide {
right: 10px;
bottom: 10px;
position: absolute;
}
#f_Slide div {
font-size: 12px;
float: left;
width: 18px;
cursor: pointer;
color: #fff;
line-height: 18px;
margin-right: 1px;
height: 18px;
text-align: center;
background-color: #FF9900;
}
#f_Slide .f1 {
background: #6f6f6f
}
.dis {
display: block
}
.undis {
display: none
}
-->
</style>
</head>
<body><div id="Slide_Focus">
<div class="dis" name="f"><img src="http://gg.blueidea.com/2010/crystal/533_104.gif" alt="" /></div>
<div class="undis" name="f"><img src="http://gg.blueidea.com/2010/ewsidc/ewsidc_766_60.gif" alt="" /></div>
<div class="undis" name="f"><img src="http://gg.blueidea.com/2010/haodou/hoto.gif" alt="" /></div>
<div id="f_Slide">
<div class="" onclick=play(x[0],0) name="f">1</div>
<div class="f1" onclick=play(x[1],1) name="f">2</div>
<div class="f1" onclick=play(x[2],2) name="f">3</div>
</div>
<SCRIPT LANGUAGE="JavaScript">
function getid(o){ return (typeof o == "object")?o:document.getElementById(o);}
function getNames(obj,name,tij)
{
var plist = getid(obj).getElementsByTagName(tij);
var rlist = new Array();
for(i=0;i<plist.length; ++i){if(plist[i].getAttribute("name") == name){rlist[rlist.length] = plist[i];}}
return rlist;
}
function fiterplay(obj,num,t,name,c1,c2)
{
var fitlist = getNames(obj,name,t);
for(i=0;i<fitlist.length;++i)
{
if(i == num)
{
fitlist[i].className = c1;
}
else
{
fitlist[i].className = c2;
}
}
}
function play(obj,num)
{
var s = getid('f_Slide');
var b = getid('Slide_Focus');
try
{
with(b)
{
filters[0].Apply();
fiterplay(b,num,"div","f","dis","undis");
fiterplay(s,num,"div","f","","f1");
filters[0].play();
}
}
catch(e)
{
fiterplay(b,num,"div","f","dis","undis");
fiterplay(s,num,"div","f","","f1");
}
}
var autoStart = 0;
var n = 0; var s = getid("f_Slide");
var x = getNames(s,"f","div");
function clearAuto() {clearInterval(autoStart);};
function setAuto(){autoStart=setInterval("auto(n)", 2000)}
function auto() {
n++;
n%=x.length;
play(x[n],n);
}
function ppp(){
setAuto();
}
ppp();
</SCRIPT>
</div>
</body>
</html> 展开
<title></title>
<style type="text/css">
<!--
#Slide_Focus {
filter: progid:dximagetransform.microsoft.fade ( duration=0.5,overlap=1.0 );
overflow: hidden;
height: 104px;
position: relative;
width: 503px;
}
#Slide_Focus IMG {
height: 104px;
width: 503px;
}
#f_Slide {
right: 10px;
bottom: 10px;
position: absolute;
}
#f_Slide div {
font-size: 12px;
float: left;
width: 18px;
cursor: pointer;
color: #fff;
line-height: 18px;
margin-right: 1px;
height: 18px;
text-align: center;
background-color: #FF9900;
}
#f_Slide .f1 {
background: #6f6f6f
}
.dis {
display: block
}
.undis {
display: none
}
-->
</style>
</head>
<body><div id="Slide_Focus">
<div class="dis" name="f"><img src="http://gg.blueidea.com/2010/crystal/533_104.gif" alt="" /></div>
<div class="undis" name="f"><img src="http://gg.blueidea.com/2010/ewsidc/ewsidc_766_60.gif" alt="" /></div>
<div class="undis" name="f"><img src="http://gg.blueidea.com/2010/haodou/hoto.gif" alt="" /></div>
<div id="f_Slide">
<div class="" onclick=play(x[0],0) name="f">1</div>
<div class="f1" onclick=play(x[1],1) name="f">2</div>
<div class="f1" onclick=play(x[2],2) name="f">3</div>
</div>
<SCRIPT LANGUAGE="JavaScript">
function getid(o){ return (typeof o == "object")?o:document.getElementById(o);}
function getNames(obj,name,tij)
{
var plist = getid(obj).getElementsByTagName(tij);
var rlist = new Array();
for(i=0;i<plist.length; ++i){if(plist[i].getAttribute("name") == name){rlist[rlist.length] = plist[i];}}
return rlist;
}
function fiterplay(obj,num,t,name,c1,c2)
{
var fitlist = getNames(obj,name,t);
for(i=0;i<fitlist.length;++i)
{
if(i == num)
{
fitlist[i].className = c1;
}
else
{
fitlist[i].className = c2;
}
}
}
function play(obj,num)
{
var s = getid('f_Slide');
var b = getid('Slide_Focus');
try
{
with(b)
{
filters[0].Apply();
fiterplay(b,num,"div","f","dis","undis");
fiterplay(s,num,"div","f","","f1");
filters[0].play();
}
}
catch(e)
{
fiterplay(b,num,"div","f","dis","undis");
fiterplay(s,num,"div","f","","f1");
}
}
var autoStart = 0;
var n = 0; var s = getid("f_Slide");
var x = getNames(s,"f","div");
function clearAuto() {clearInterval(autoStart);};
function setAuto(){autoStart=setInterval("auto(n)", 2000)}
function auto() {
n++;
n%=x.length;
play(x[n],n);
}
function ppp(){
setAuto();
}
ppp();
</SCRIPT>
</div>
</body>
</html> 展开
2个回答
展开全部
试试这个图片切换
有12345数字一起切换
鼠标点一下数字会变换到另一张图片，不点就会自动换
里面有教程和源码
参考资料： http://www.blueidea.com/common/shoutbox/redir.asp?8=n&id=10895
本回答由提问者推荐
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
在点击事件上添加clearAuto 在鼠标移除事件上添加setAuto方法
<div id="f_Slide">
<div class="f1" onclick="clearAuto();play(x[0],0)" onmouseout="setAuto()" name="f">1</div>
<div class="f1" onclick="clearAuto();play(x[1],1)" onmouseout="setAuto()" name="f">2</div>
<div class="f1" onclick="clearAuto();play(x[2],2)" onmouseout="setAuto()" name="f">3</div>
<div id="f_Slide">
<div class="f1" onclick="clearAuto();play(x[0],0)" onmouseout="setAuto()" name="f">1</div>
<div class="f1" onclick="clearAuto();play(x[1],1)" onmouseout="setAuto()" name="f">2</div>
<div class="f1" onclick="clearAuto();play(x[2],2)" onmouseout="setAuto()" name="f">3</div>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
