巧制可全屏拖动的图片

  • 来源: 中国IT实验室 作者: xuqingzhong   2008-05-31/14:40
  •  

     

    制作步骤:

    一、准备图片,取名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="back.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>

    好了,保存看看效果吧!


    评论 {{userinfo.comments}}

    {{money}}

    {{question.question}}

    A {{question.A}}
    B {{question.B}}
    C {{question.C}}
    D {{question.D}}
    提交

    驱动号 更多