<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> 吴丽丽I Love you! </TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="">
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
</HEAD>
<script language="javascript">
var timeObj;
var x = 5;
var y = 5;
window.onload = function moveDiv(){
var bodyWidth = document.body.clientWidth;
var bodyHeight = document.body.clientHeight;
var imgDiv = document.getElementById("imgDiv");
var tops = parseInt(imgDiv.style.top);
var lefts = parseInt(imgDiv.style.left);
imgDiv.style.top = tops+x;
imgDiv.style.left = lefts+y;
if(tops>bodyHeight-140){
x = -5;
}
if(tops<0){
x = 5;
}
if(lefts>bodyWidth-130){
y = -5;
}
if(lefts<0){
y = 5;
}
timeObj = window.setTimeout("moveDiv()","10");
}
</script>
<BODY>
<h1>可移动DIV!</h1><br>
<div id="imgDiv" style="position:absolute;top=210;left=210;background='#FFEFAQ';border=1px solid #6633FF;width=130px;height=140px">
<img src="wll.jpg" width="130" height="140" alt="我是图片" />
</div>
</BODY>
</HTML>
分享到：
相关推荐
可移动的DIV可移动DIV可移动DIV可移动DIV可移动DIV可移动DIV可移动DIV可移动DIV可移动DIV可移动DIV可移动DIV可移动DIV可移动DIV可移动DIV可移动DIV可移动DIV可移动DIV可移动DIV可移动DIV可移动DIV可移动DIV可移动DIV...
标题“可移动div”指的是在网页开发中，创建一个可以被用户通过鼠标拖动来改变位置的div元素。这样的功能通常用于创建浮动窗口、对话框或者自定义的控件，让用户能够自由调整其在页面上的布局。在网页设计中，这种...
综合以上，"模式对话框(可刷新)+可移动div+遮罩层"是一个高级的前端UI技术组合，它在很多现代Web应用中都有广泛应用，比如在线协作工具、内容管理系统和电子商务平台等。通过学习和实践这些技术，开发者可以提升网页...
参考自：http://blog.csdn.net/k8080880/article/details/7166351 这下载文件只是为了懒人做的...
**jQuery自定义可移动div弹窗** 在网页开发中，弹窗是一种常见的交互元素，用于显示重要的信息、警告、确认对话框或者用户需要填写表单等。jQuery库因其易用性和丰富的插件生态，常被用来实现这类功能。本教程将...
在鼠标移动时，根据鼠标移动的距离更新div的位置；最后，当鼠标释放时，停止更新div位置。为了使div更具交互性，可能还需要添加一些边界检查，以防止div移出屏幕。 其次，“弹窗”通常是指一个模态或非模态的窗口，...
当我们需要创建一个可移动的div元素时，这通常涉及到动态布局和事件处理。本篇文章将详细探讨如何利用这些技术来实现一个可拖动的div。 首先，我们需要创建基本的HTML结构，一个简单的div元素作为我们要拖动的对象...
在这个场景中，"jquery div 可拖拽弹出对话框" 指的是利用 jQuery 实现的一个功能，允许用户可以手动拖动 HTML 的 `div` 元素（通常用于创建对话框或模态窗口）在页面上自由移动。这种功能提高了用户体验，让用户...
在网页设计中，"DIV可移动布局"是一种常见的前端技术，它允许用户通过拖动页面上的元素来调整页面布局，从而实现类似QQ空间那样的个性化和交互性。这种技术结合了HTML、CSS和JavaScript，为用户提供了一种动态和灵活...
标题中的“DIV可移动 可实现任意拖动放大缩小”是指一种使用JavaScript技术来实现的交互功能，允许用户在网页上自由地拖动、缩放HTML中的div元素。这一功能通常用于创建用户界面元素，如窗口、面板或者任何需要动态...
在页面上实现自由拖动DIV的小程序；鼠标点击后选中DIV并开始拖动，拖动过程中透明显示，移动时根据鼠标位置计算控件左上角的绝对位置，松开鼠标后停止移动并恢复成不透明
在网页设计和开发中，创建一个可移动的div层是一个常见的需求，这通常涉及到JavaScript或者CSS的交互式应用。标题“可移动的div层，简单通用”表明我们要讨论的是一个适用于多种情况、易于实现的解决方案，它允许...
在网页设计中，"div移动块"是一种常见的技术，它允许开发者创建可移动的元素，如窗口、广告栏或其他互动式界面组件。这种技术主要基于HTML的`<div>`元素结合JavaScript来实现，使得用户可以通过点击或拖动来改变元素...
动态创建可移动可改变大小的DIV，挺好用的。
它可能包含了创建、显示、隐藏以及移动div的函数。例如，可能有一个名为`showDiv()`的函数用于弹出div，一个`hideDiv()`的函数用于关闭，以及一个处理`mousemove`事件的函数来更新div的位置。 5. **框架内容**：...
Div 对话框 可移动 可设遮罩层 可以同时打开多个对话框，JS源代码
本项目“jQuery可拖拽DIV页面”利用jQuery及其扩展插件jQuery UI，实现了一个用户界面元素（如div）可以被拖动的功能，从而为用户提供更直观的交互体验。以下是对这个知识点的详细讲解： 1. **jQuery基础**：jQuery...
要实现`div`的大小可调节，可以添加可拖动的边框，同样使用鼠标事件来处理。监听`mousedown`事件，根据鼠标位置确定是哪个边框被拖动，然后在`mousemove`事件中计算新的尺寸，并更新`div`的宽度和高度。JQuery的`...
标题中的“基于bootstrap和jquery的可拖拽移动div，可预览的页面生成器”指的是一个Web开发工具，它利用Bootstrap框架和jQuery库构建，允许用户通过拖拽和放置的方式设计网页布局，并实时预览编辑效果。Bootstrap是...
`div`拖放功能是网页交互设计中的一个重要部分，它允许用户通过鼠标操作移动页面上的元素，提高了用户体验。C#通常与ASP.NET框架一起使用，为Web应用程序提供后端逻辑支持。虽然`div`拖放功能主要由前端JavaScript或...