最新更新 sitemap 设计搜素
网页设计
国外网站 韩国网站 个人主页 手提袋设计 CSS 网页特效 平面设计 网站设计 Flash CMS技巧 服装网站 php教程 photoshop 画册 服务器选用 数据库 Office
网上家居 虚拟主机 域名注册 云主机 网页设计 客服QQ:8208442

dreamweaver制作可控制的横向滚动

日期:11-11    来源:5D多媒体|    作者:

2. 下面代码是层滚动代码,我们插到层标记< div >的下面:

插入时注意layerW的值为剪辑(clip)右的值,这里为340。

< script language="javascript" >

< !-- //by hve

var layerW=340; //设定显示区域的宽

var layerH=parseInt(slayer.style.height);

var layerL=parseInt(slayer.style.left);

var layerT=parseInt(slayer.style.top);

var step=0; //scroll value

function movstar(a,time){

if (a< 0&&step >-parseInt(slayer.scrollWidth)+layerW||a >0&&step< 0)

mov(a);

movx=setTimeout("movstar("+a+","+time+")",time);

}

function movover(){

clearTimeout(movx);

}

function mov(a){

slayer.style.left = (step+=a) + layerL;

clipL=0-step;

clipR=layerW-step;

clipB=layerH;

clipT=0;

slayer.style.clip="rect("+clipT+" "+clipR+" "+clipB+" "+clipL+")";

}

//-- >

< /script >


3. 再插入一个层放置“控制按钮”。

这个层靠在前面层的下面,用来放置“控制按钮”,位置可以根据需要自行调整,如下图。我们这里用表格的色块当作控制按钮,如果做两个箭头形状的图片会更好。