感觉是对的 效果是错的

wtcsy 2009-05-11 01:09:08 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<style type="text/css">

#ss{  width:130px;height:88px;margin:0 auto;overflow: hidden;white-space: nowrap;background:#ffffff; border:1px solid #000000}

#ss ul{margin:0px; padding:0px;}

#ss ul li{ margin:0px; padding:0px; list-style:none; display:inline;}

</style>

<body>



<div id='ss'>

<ul>

<li><img src="http://img1.qq.com/news/pics/17522/17522502.jpg"/></li>

<li><img src="http://img1.qq.com/news/pics/17515/17515126.jpg"/></li>

<li><img src="http://img1.qq.com/news/pics/17515/17515135.jpg"/></li>

<li><img src="http://img1.qq.com/news/pics/17515/17515141.jpg"/></li>

<li><img src="http://img1.qq.com/news/pics/17522/17522502.jpg"/></li>

</ul>

</div>

<div id='s'></div>

<script>

/////////////////////////////////////////////////////////////////////////////////

var Tween = {

    Elastic: {

        easeOut: function(t,b,c,d,a,p){

            if (t==0) return b;  if ((t/=d)==1) return b+c;  if (!p) p=d*.3;

            if (!a || a < Math.abs(c)) { a=c; var s=p/4; }

            else var s = p/(2*Math.PI) * Math.asin (c/a);

            return (a*Math.pow(2,-10*t) * Math.sin( (t*d-s)*(2*Math.PI)/p ) + c + b);

        }

    }

}

/////////////////////////////////////////////////////////////////////////////////



function $(Id){return document.getElementById(Id)};

var n = $('ss').getElementsByTagName('li').length-1;

var w = $('ss').getElementsByTagName('li')[0].offsetWidth;

var i=0,t=0,b=0,c=w,d=110;



function Run(){

	$('ss').scrollLeft = Math.ceil(Tween.Elastic.easeOut(t,b,c,d));

	if(t<d)

	{ t++;setTimeout(Run, 10);}

	else{

		if(i==(n-1))

		{$('ss').scrollLeft=0;i=0,b=0,c=w,t=0}

		else

		{t=0,b=c,c=c+w,i++;}  //这里b=c  和c=c+w  就是重新赋值了  感觉按每次移动一个图片大小的位置来看 没有错误呀，  为什么效果会不对了？

		$('s').innerHTML=$('ss').scrollLeft;setTimeout(Run, 1000);

	}

};

setTimeout(Run,2000);

</script>

</body>
...全文
149 5 打赏 收藏 转发到动态 举报
写回复
用AI写文章
5 条回复
切换为时间正序
请发表友善的回复…
发表回复
wtcsy 2009-05-11
  • 打赏
  • 举报
 回复 


<style type="text/css">

#ss{  width:130px;height:88px;margin:0 auto;overflow: hidden;white-space: nowrap;background:#ffffff; border:1px solid #000000}

#ss ul{margin:0px; padding:0px;}

#ss ul li{ margin:0px; padding:0px; list-style:none; display:inline;}

</style>

<body>



<div id='ss'>

<ul>

<li><img src="http://img1.qq.com/news/pics/17522/17522502.jpg"/></li>

<li><img src="http://img1.qq.com/news/pics/17515/17515126.jpg"/></li>

<li><img src="http://img1.qq.com/news/pics/17515/17515135.jpg"/></li>

<li><img src="http://img1.qq.com/news/pics/17515/17515141.jpg"/></li>

<li><img src="http://img1.qq.com/news/pics/17522/17522502.jpg"/></li>

</ul>

</div>

<div id='s'></div>

<li><img src="http://img1.qq.com/news/pics/17522/17522502.jpg"/></li>

<li><img src="http://img1.qq.com/news/pics/17515/17515126.jpg"/></li>

<li><img src="http://img1.qq.com/news/pics/17515/17515135.jpg"/></li>

<li><img src="http://img1.qq.com/news/pics/17515/17515141.jpg"/></li>

<li><img src="http://img1.qq.com/news/pics/17522/17522502.jpg"/></li>

<script>

/////////////////////////////////////////////////////////////////////////////////

var Tween = {

    Elastic: {

        easeOut: function(t,b,c,d,a,p){

            if (t==0) return b;  if ((t/=d)==1) return b+c;  if (!p) p=d*.3;

            if (!a || a < Math.abs(c)) { a=c; var s=p/4; }

            else var s = p/(2*Math.PI) * Math.asin (c/a);

            return (a*Math.pow(2,-10*t) * Math.sin( (t*d-s)*(2*Math.PI)/p ) + c + b);

        }

    }

}

/////////////////////////////////////////////////////////////////////////////////



function $(Id){return document.getElementById(Id)};

var n = $('ss').getElementsByTagName('li').length-1;

var w = $('ss').getElementsByTagName('li')[0].offsetWidth;

var i=0,t=0,b=0,c=w,d=110;



function Run(){

	$('ss').scrollLeft = Math.ceil(Tween.Elastic.easeOut(t,b,c,d));

	if(t<d)

	{ t++;setTimeout(Run, 10);}

	else{

		if(i==(n-1))

		{$('ss').scrollLeft=0;i=0,b=0,c=w,t=0}

		else

		{i++;t=0,b=i*w,c=w;}

		$('s').innerHTML=$('ss').scrollLeft;setTimeout(Run, 1000);

	}

};

setTimeout(Run,2000);

</script>

</body>
wtcsy 2009-05-11
  • 打赏
  • 举报
 回复
感觉我就象个送分的额！~
wtcsy 2009-05-11
  • 打赏
  • 举报
 回复
我晕
我写setTimeout(Run,2000);只是希望不要一开始就晃 看不清第一张图片是啥
xiaojing7 2009-05-11
  • 打赏
  • 举报
 回复
可以正常运行啊
xiaojing7 2009-05-11
  • 打赏
  • 举报
 回复
setInterval(Run,2000);
mvc实战-仿SpringMVC 框架实现
  Spring这个自从诞生就一直很火的项目，现在依旧宝刀不老，几年前还信心满满的去读它的源码，结果是似懂非懂，云里雾里的感觉，现在注解，反射，泛型等java新特性让我们构建像spring这样的框架简单很多。这一次，我将带不在被框架引导开发，而是自己朝着架构的方向前进。讲自己的架构思维能力，达到终的效果我们不是征服框架。而是创造框架。
使用css3实现翻书效果（一）
最近在网页上看到一个使用CSS3制作的很有趣的样式，通过纯css3的使用实现翻书的效果，作为初学者的我决定实现一下该效果~该网站特效如图所示： 是不是感觉特效非常棒，直接使用css样式而不使用图片大大减少了加载速度，也降低了用户流量的损耗，实在是一举两得，下面我介绍一下我的开发步骤： 经过我对网站代码的研究，该书籍div分为以下几部分 1.最上层是写着“CSS TRA
Flutter Tween实现抖动效果
抖动效果实现起来并不难，主要是使用动画时定义一个摇摆的曲线。可应用于错误反馈等 效果图 所需知识 Tween动画 Curve曲线 实现代码 定义变量 //平移动画控制器 AnimationController mAnimationController; //提供一个曲线，使动画感觉更流畅 CurvedAnimation offsetCurvedAnimation; //平移动画...
yolov5 识别效果不好如何判断原因
yolov5 训练完模型以后发现 对测试图片的识别效果不好. 那么这个时候该怎么办呢? 是过拟合还是欠拟合了呢? 怎么判断呢? 欠拟合 机器学习中一个重要的话题便是模型的泛化能力，泛化能力强的模型才是好模型，对于训练好的模型，若在训练集表现差，在测试集表现同样会很差，这可能是欠拟合导致, 这是泛化能力太强, 训练集上和测试集上误识别比较高. 欠拟合解决方法 最简单的是增加数据集的正样本数, 增加主要特征的样本数量 增加训练次数. 有可能是你还没有训练到合适的次数, 网络还没有学习到特征就被你停止掉
【Python】控制台输出打印机效果
这个效果其实不是我刻意去研究的，起因在于最近使用ChatGPT与一款国产的AI，发现国产的AI没有打印机输出的效果（这种效果自我感觉是一个比较好的点），无意中发现python可以做。话不多说，上代码！
JavaScript

87,907

社区成员

224,614

社区内容

发帖
与我相关
我的任务
社区描述
Web 开发 JavaScript
社区管理员
  • JavaScript
  • 无·法
加入社区
  • 近7日
  • 近30日
  • 至今

加载中

查看更多榜单
社区公告
暂无公告

试试用AI创作助手写篇文章吧

+ 用AI写文章