网站制作培训之用DW制作可全屏拖动的图片
我们可以用鼠标把Dreamweaver的层在页面内拖动,但要全屏拖动就困难了,下面是一种实现的方法:
制作步骤:
一、准备图片,取名back.jpg。
二、建一个htm文件取名drag.htm,并写入下列代码:
< html>
< head>
< title>可拖动的图片< /title>
< meta http-equiv="Content-Type" content="text/html; charset=gb2312">
< /head>
< body bgcolor="#FFFFFF" text="#000000" scroll=no topmargin=0 leftmargin=0 onmousedown="x=event.x;y=event.y;setCapture()" onmouseup="releaseCapture()" onmousemove="if(event.button==1)top.moveTo(screenLeft+event.x-x,screenTop+event.y-y)" ondblclick="self.close()">
< img src=/web/tech/UploadPic/2007-5/2007520182936447.jpg" width="120" height="120" style="cursor:hand;border:3 gold ridge">
< /body>
< /html>
drag.htm便是一个可以被拖动的页面。
三、在其他页面中调用drag.htm,加上下面的代码:
< head>
< title>可全屏拖动的图片< /title>
< meta http-equiv="Content-Type" content="text/html; charset=gb2312">
< script language="JavaScript">
function drag(){
var win;
win=window.open("drag.htm","","fullscreen");
win.moveTo(200,200);
win.resizeTo(126,126);
win.focus();
}
< /script>
< /head>
并用链接打开:
< a href="javascript:drag()">点击这里< /a>
临沂网站创业项目:临沂网站制作培训
- 网页设计引入CSS样式的五种方式
- 网站制作培训之webService的远程调试问题
- 超级漂亮的表格:彩色背景
- 网页特效推荐 可以任意编辑的动态表格
- 图片在显示一定的时间后消失
- 网站制作培训之网页导航设计九大注意事项
- 网站制作培训之以新窗口的形式打开目标链接
- 在自己的计算机上安装Discuz!论坛
- 用FireWorks 三帧轻松打造酷 Banner
- 值得收藏的东东 50条网页制作小技巧集锦
- 网站制作培训-合理的网页设计所具有的特征
- 网页特效:expression将JS、Css结合起来
- 网页中文字不跟随浏览器字体大小设置而变动?
- 解决img图片下多余空白的CSS代码
- 网站设计教程之色彩系列教程:基础知识
- 网页框架和网页框架集如何工作
- 在页面上实现Google PR值的显示
- 网站制作培训之Dreamweaver网页制作秘诀之二
- 网页特效:滚动条的彩色显示
- 临沂网站制作培训之Dreamweaver编写CSS的技巧