主站经典论坛家园作品集 Think.Pages 维基桌面聚合

经典论坛 » 前台制作与脚本专栏 » 图片滚动问题

‹‹ 上一主题 | 下一主题 ››

发新话题

打印

图片滚动问题

jd808 [楼主]

凝决

银牌会员

帖子: 1046
体力: 2838
威望: 0
当前: 广东广州
离线: 3 天

1^# 大中小发表于 2008-8-25 11:12

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style type="text/css">
<!--
TD {FONT-SIZE: 12px;}
</style>
</head>
<BODY>
<div id=demo style="OVERFLOW: hidden; WIDTH: 760px; align: center">
  <table cellspacing="0" cellpadding="0" align="center" border="0">
    <tbody>
      <tr>
        <td id="marquePic1" valign="top">
		
<table width="100%" height="130" border="0" cellpadding="0" cellspacing="0">
  <tr>
    <td  height="110" align="center">
	<IMG height=128 src="http://img.blog.163.com/photo/Y1-4whLQBVJ4XR98N01d5A==/898468125660489439.jpg" width=128 border=5>
	<br/>
	A1
	</td>
    <td  align="center">
	<IMG height=128 src="http://img.blog.163.com/photo/eGvy4wo0lgPo6vGj-ZqioQ==/1986650385623923237.jpg" width=128 border=5>
	<br/>A1
	</td>
    <td  align="center">
	<IMG height=128 src="http://img.blog.163.com/photo/BQ8tkjUTSGykmeCH-regHQ==/1986650385623923277.jpg" width=128 border=5>
	<br/>A1
	</td>
    <td  align="center">
	<IMG height=128 src="http://img.blog.163.com/photo/bcmH88e03HdlCmvVlyrzVw==/2038723256315393985.jpg" width=128 border=5>
	<br/>A1
	</td>
    <td  align="center">
	<IMG height=128 src="http://img.blog.163.com/photo/ZqKSnCc3BAYaIp7BD6O1gA==/1167839678372627888.jpg" width=128 border=5>
	<br/>A1
	</td>
    <td  align="center">
	<IMG height=128 src="http://img.blog.163.com/photo/-B10R60bVOTZPumL3GAagw==/1167839678372627921.jpg" width=128 border=5>
	<br/>A1
	</td>
    <td  align="center">
	<IMG height=128 src="http://img.blog.163.com/photo/jvyE-AO9Bm0ulUHWYIsTmw==/1167839678372627972.jpg" width=128 border=5>
	<br/>A1
	</td>
    <td  align="center">
	<IMG height=128 src="http://img.blog.163.com/photo/xtgHAE7igHZtTwbj4Tf23Q==/329044247774829694.jpg" width=128 border=5>
	<br/>A1
	</td>
    <td  align="center">
	<IMG height=128 src="http://img.blog.163.com/photo/NaamXbkyoAP7XzY9w2qi7w==/329607197728251088.jpg" width=128 border=5>
	<br/>A1
	</td>
  </tr>
</table>		
		
		</td>
        <td id="marquePic2" valign="top"></td>
      </tr>
    </tbody>
  </table>
</div>
<script type=text/javascript> 
var speed=1; 
marquePic2.innerHTML=marquePic1.innerHTML ;
function Marquee()
{ 
	if(demo.scrollLeft>=marquePic1.scrollWidth)
	{ 
		demo.scrollLeft=0 
	}else{ 
		demo.scrollLeft=demo.scrollLeft+10;
	}
}
var MyMar=setInterval(Marquee,speed) 
demo.onmouseover=function() {clearInterval(MyMar)} 
demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)} 
</script>
</BODY>
</HTML>

提示：您可以先修改部分代码再运行

如何让他快速滚动一屏就停下来，过3秒后再滚动一屏。
这个只能实现快速滚动，不会自动停下来

www.gyqpw.com 广源汽车配件报价网

TOP

做西部数码代理.Cn1元国际45元 | 微软开发者工具互动网站

marvellous

金翅擘海

荣誉管理团队

帖子: 11836
体力: 26946
威望: 141
当前: 北京朝阳区

2^# 大中小发表于 2008-8-25 14:00

<script language="javascript">
function Marquee()
{
	this.ID = document.getElementById(arguments[0]);
	this.Direction = arguments[1];
	this.Step = arguments[2];
	this.Width = arguments[3];
	this.Height = arguments[4];
	this.Timer = arguments[5];
	this.WaitTime = arguments[6];
	this.StopTime = arguments[7];
	if(arguments[8])
		this.ScrollStep = arguments[8]
	else
		this.ScrollStep = this.Direction>1 ? this.Width : this.Height;
	this.CTL = this.StartID = this.Stop = this.MouseOver = 0;
	this.ID.style.overflowX = this.ID.style.overflowY = "hidden";
	this.ID.noWrap = true;
	this.ID.style.width = this.Width;
	this.ID.style.height = this.Height;
	this.ClientScroll += this.Direction>1 ? this.ID.scrollWidth : this.ID.scrollHeight;
	//this.ClientScroll +=  this.ID.scrollHeight;
	this.ID.innerHTML += this.ID.innerHTML;
	this.Start(this,this.Timer,this.WaitTime,this.StopTime);
	
}
Marquee.prototype.Start = function(msobj,timer,waittime,stoptime)
{
	msobj.StartID = function(){msobj.Scroll()}
	msobj.Continue = function()
				{
					if(msobj.MouseOver == 1)
					{
						setTimeout(msobj.Continue,waittime);
					}
					else
					{	clearInterval(msobj.TimerID);
						msobj.CTL = msobj.Stop = 0;
						msobj.TimerID = setInterval(msobj.StartID,timer);
					}
				}
	msobj.Pause = function()
			{
				msobj.Stop = 1;
				clearInterval(msobj.TimerID);
				setTimeout(msobj.Continue,waittime);
			}
	msobj.Begin = function()
	{
		msobj.TimerID = setInterval(msobj.StartID,timer);
		msobj.ID.onmouseover = function()
					{
						msobj.MouseOver = 1;
						clearInterval(msobj.TimerID);
					}
		msobj.ID.onmouseout = function()
					{
						msobj.MouseOver = 0;
						if(msobj.Stop == 0)
						{
							clearInterval(msobj.TimerID);
							msobj.TimerID = setInterval(msobj.StartID,timer);
						}
					}
	}
	setTimeout(msobj.Begin,stoptime);
}
Marquee.prototype.Scroll = function()
{
	switch(this.Direction)
	{
		case 0:
			this.CTL += this.Step;
			if(this.CTL >= this.ScrollStep && this.WaitTime > 0)
			{
				this.ID.scrollTop += this.ScrollStep + this.Step - this.CTL;
				this.Pause();
				return;
			}
			else
			{   
				if(this.ID.scrollTop >= this.ClientScroll)
				{
					this.ID.scrollTop -= this.ClientScroll;
				}
				this.ID.scrollTop += this.Step;
			}
		break;
		case 1:
			this.CTL += this.Step;
			if(this.CTL >= this.ScrollStep && this.WaitTime > 0)
			{
				this.ID.scrollTop -= this.ScrollStep + this.Step - this.CTL;
				this.Pause();
				return;
			}
			else
			{
				if(this.ID.scrollTop <= 0)
				{
					this.ID.scrollTop += this.ClientScroll;
				}
				this.ID.scrollTop -= this.Step;
			}
		break;
		case 2:
			this.CTL += this.Step;
			if(this.CTL >= this.ScrollStep && this.WaitTime > 0)
			{
				this.ID.scrollLeft += this.ScrollStep + this.Step - this.CTL;
				this.Pause();
				return;
			}
			else
			{
				if(this.ID.scrollLeft >= this.ClientScroll)
				{
					this.ID.scrollLeft -= this.ClientScroll;
				}
				this.ID.scrollLeft += this.Step;
			}
		break;
		case 3:
			this.CTL += this.Step;
			if(this.CTL >= this.ScrollStep && this.WaitTime > 0)
			{
				this.ID.scrollLeft -= this.ScrollStep + this.Step - this.CTL;
				this.Pause();
				return;
			}
			else
			{
				if(this.ID.scrollLeft <= 0)
				{
					this.ID.scrollLeft += this.ClientScroll;
				}
				this.ID.scrollLeft -= this.Step;
			}
		break;
	}
}
</script>
<nobr>
<div id="ad">
<a href="http://www.hao123.com" target=_blank><img width=88 height=31 src=http://gg.blueidea.com/logo/hao123/logo.gif border=0 alt="网址之家"></a><a href="http://www.pconline.com.cn/pcedu" target=_blank><img src=http://gg.blueidea.com/logo/pconline/pconline.gif border=0></a><a href="http://design.yesky.com/" target=_blank><img src=http://gg.blueidea.com/logo/yesky/yeskylogo.gif border=0 alt=天极网页陶吧></a><a href="http://www.yesky.com/SoftChannel/72347865107660800/index.shtml" target=_blank><img src=http://gg.blueidea.com/logo/yesky/yeskytools.gif border=0 alt=玩转软件，尽在天极网工具软件></a><a href="http://www.computerarts.com.cn" target=_blank><img src=http://gg.blueidea.com/logo/computerarts/logo.gif border=0 alt=数码艺术杂志></a><a href="http://www.dasuanban.com" target=_blank><img src=http://gg.blueidea.com/logo/dasuanban/logo.gif border=0 alt=大蒜瓣></a><a href="http://www.visionunion.com" target=_blank><img src=http://gg.blueidea.com/logo/vu/logo.gif border=0 alt=视觉同盟></a><a href="http://www.cndu.cn" target=_blank><img src=http://gg.blueidea.com/logo/szdesign/chinadu_88_31_logo.gif border=0 alt=设计联盟></a></div>
</nobr>
<script defer>
new Marquee("ad",2,20,440,31,20,4000,5000,88);
</script>

提示：您可以先修改部分代码再运行

┏┯┓┏┯┓┏┯┓┏┯┓
┠知┨┠往┨┠观┨┠来┨
┗┷┛┗┷┛┗┷┛┗┷┛

TOP

美橙vps独立IP月付189元 | 千千静听皮肤设计大赛

jd808 [楼主]

凝决

银牌会员

帖子: 1046
体力: 2838
威望: 0
当前: 广东广州
离线: 3 天

3^# 大中小发表于 2008-8-25 14:00

奥运完了有空高手就帮帮忙啦，这个我研究过一会啦可就是没法下手

www.gyqpw.com 广源汽车配件报价网

TOP

activeTechPros 共享IT行业薪资信息 | 《疯狂的程序员》劲爆上市

‹‹ 上一主题 | 下一主题 ››

发新话题