scrollLeft实现按钮控制滚动条相册

 　　我想，大家对于网易这个相册，一定印像深刻：


　　之前，我们也用网易的代码实现了这个相册，今天，我们通过scrollLeft来实现这个相册吧，但我们加多了滚动条，没有网易做得那么完美啊。我们先下我们做出来的效果：


　　如果你理解了scrollLeft的用法，那么我们今天这个例子就容易理解了。


　　注意上面的画线部分，我在脚本里这样实现：


　　这就是实现按钮按钮滚动条的关键啦，当然，样式也是要处理的：


　　至于像小图变大图，点击上面的前头，实现小图切换大图的，大家要可以看看我的JQUERY代码啊。。。想想，scrollLeft,scrollTop的作用还真是巨大啊。。。在dom文档里，经常要用到，大家可要好好学哦。。。

时间： 2024-02-23 16:35:50

scrollLeft实现按钮控制滚动条相册的相关文章

javascript控制滚动条与获取控件的位置

ie 6 需要用document.documentElement.scrollTop 获取滚动条位置 ie 其他版本可以用 document.body.scrollTop 获取滚动条位置 其他浏览器可以用 window.pageYOffset 获取滚动条位置 当聊天室的内容超出页面范围时, 如何让页面刷新后 显示最下面的内容  代码如下 复制代码  document.getElementById ( 'chatboard').scrollTop=document.getElementById (

js控制滚动条缓慢滚动到顶部

<html> <head> <script type="text/javascript"> var currentPosition,timer; function GoTop(){ timer=setInterval("runToTop()",1); } function runToTop(){ currentPosition=document.documentElement.scrollTop || document.body.

jquery仿QQ商城带左右按钮控制焦点图片切换滚动效果

jquery图片特效制作仿腾讯QQ商城首页banner焦点图片轮播切换效果,带索引按钮控制和左右按钮控制图片切换,实例代码如下,感兴趣的朋友可以参考下哈   复制代码 代码如下: <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>jquery图片

Flash按钮控制声音具体实现

按钮|控制 刚有网友问我怎么在flash中控制声音的开始和停止.开始我想拿按钮stop再play不就OK了?再一试才想起来声音不能这么控制.要想知道怎么做,请接着往下看.展示: 点击这里下载源文件 首先准备你的材料:声音文件(不要太大哦),随便做一个动画再从库里面拖出来个按钮.开始咯.先把演员定位.我是这么放的,图层一放动画,取个名字就叫动画吧.图层二放按钮.图层三放声音.(其实位置随便吧).把演员们都放上去吧.见下图: 在库里面右键点击你的声音,选择"链接..." 在弹出的对话框里面

6种常用的＂一个按钮控制播放与暂停＂的方法

按钮|控制 经常在论坛里看到一些朋友有在问这个问题,刚好下午有点时间,就整理了六种最常用的一个按钮控制MC播放方法,拿来跟大家共享,希望能启到抛砖引玉作用,大家有更好的算法,希望都拿出来共享: 附上原件供学习: 点击这里下载源文件 ps=0;//初始化ps,有些算法要用到. //循环算法-1 on (release) {  i++;  if (i == 1) {   play();  } else {   stop();  }  if (i>=2) { //当i=2时,让i=0,i就在1-0之间

做个按钮控制图片缓冲切换的效果(带模糊滤镜)

按钮|控制|滤镜 一个带缓冲的图片切换的效果,按钮控制,加了模糊滤镜,提升速度感.源文件已附上.下面是代码: stop(); /////也打上自己的名字-_-,绝命时刻2006年11月18日/////// var sz = 127; var sd = 3; var temp = 1; tempT = temp; t1 = "按钮控制缓冲:带缓冲效果的图片切换."; mcX = mc._x; xfmc._visible = false; if (temp == 1) {         

Flash中一个按钮控制播放和停止的2种算法

按钮|控制|算法 第一种ps=0;//初始化ps,有些算法要用到.  //循环算法-1  on (release) {  i++;  if (i == 1) {  play();  } else {  stop();  }  if (i>=2) { //当i=2时,让i=0,i就在1-0之间循环  i = 0;  }  }第二种on (release) {  if (!ps) { //非算法,非真等于假,非假等于真  stop();  ps = true;//或者ps=1;因为算法里1代表真0代

Axure RP 8怎么制作按钮控制下拉框选项?

  Axure RP 8怎么制作按钮控制下拉框选项?          1.打开Axure RP 8软件,在软件库中找到下拉框元件,拖一个到画布上,如下图所示: 2.再次在元件库中找到"主要按钮",拖一个到画布上,然后改变按钮的宽度和高度,使其和下拉框宽度一致,如下图所示: 3.选中"添加"按钮,在属性选项卡添加鼠标单击时用例,如下图所示: 4.勾选下拉框元件,插入变量或函数,这里选择默认时间函数,如下图所示: 5.选中设置时间函数获取毫秒数,设置完毕后单击&quo

delphi发送消息控制滚动条使用示例

本文为大家详细介绍下delphi实现发送消息控制滚动条,主要函数及用法如下,感兴趣的朋友可以参考下哈   1.Perform 函数 复制代码 代码如下: DBGrid1.Perform(WM_VSCROLL,SB_PAGEDOWN,0); //控制滚动条,向后翻页 DBGrid1.Perform(WM_VSCROLL,SB_PAGEUP,0); //控制滚动条,向前翻页 2.SendMessage 函数 复制代码 代码如下: SendMessage(DBGrid1.Handle,WM_VSCRO