巧制可全屏拖动的图片

2016-02-19 18:41 17 1 收藏

人生本是一个不断学习的过程,在这个过程中,图老师就是你们的好帮手,下面分享的巧制可全屏拖动的图片懂设计的网友们快点来了解吧!

【 tulaoshi.com - Web开发 】

我们可以用鼠标把的层在页面内拖动,但要全屏拖动就困难了,下面是一种实现的方法:

制作步骤:

(本文来源于图老师网站,更多请访问https://www.tulaoshi.com/webkaifa/)

一、准备图片,取名back.jpg,如下:

(本文来源于图老师网站,更多请访问https://www.tulaoshi.com/webkaifa/)

二、建一个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="/Files/BeyondPic/oldjcwimg/2005-11/15/05111512221550167.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

好了,保存看看效果吧!

来源:https://www.tulaoshi.com/n/20160219/1618658.html

延伸阅读
标签: flash教程
二、同时实现拖动图片和改变图片的大小 要同时达到以上两个目的,我们可以模仿Windows窗口的操作,即制作两个按钮,一个按钮放在图片的上部,作为模拟的“标题栏”,拖动它即可拖动图片;一个按钮放在图片的右下角,按下它拖动即可改变图片的大小。制作方法如下: 1. 启动Flash MX,单击“插入→新建元件”,在“创建新元件”对话框中...
标签: flash教程
(3)返回主场景,从库中把刚制作的“图片剪辑”拖入到主场景中,选定该剪辑,输入如下AS语句: onClipEvent (enterFrame) { // 剪辑事件为进入帧 if (tuodong==1) { startDrag(this); } else { stopDrag(); } // 判断变量 tuodong的值,来确定是否拖动影片剪辑 if (daxiao==1) { this._width = _root._xmouse-x1; this._height = _root._ymous...
标签: 孕前
谁的基因决定胎宝宝身高相貌 身高是谁的遗传大?——父母各占一半 在营养状况下的前提下,孩子的身高有70%的主动权掌握在父母的手里,父母的遗传是决定孩子身高的主要因素,因为决定身高的因素35%来自父亲,35%来自母亲。假若父母双方个头不高,那就要靠宝宝后天那30%的努力了。 智力是谁...
标签: flash教程
在Authorware中实现拖动图片及改变图片的大小,这对于交互型的课件是非常重要的。那么,在Flash中可不可以实现以上的功能呢?答案是肯定的,Flash凭借强大的ActionScript脚本语言,可以轻松达到这个目的。下面我们来具体看看怎么制作。 一、自由拖动图片 如果仅仅是要实现拖动图片的话,制作是非常简单的。我们只需把图片先放到一个按钮中...
标签: 巧制干葱
巧制干葱 准备原料废葱叶。 葱叶切成葱花,细的好,我切粗了。 葱花加适量盐腌制5分钟。 ...

经验教程

77

收藏

76
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部