`
izuoyan
  • 浏览: 9221609 次
  • 性别: Icon_minigender_1
  • 来自: 上海
社区版块
存档分类
最新评论

IE中实现图片的拖拽

IEJavaScriptHTML浏览器 
阅读更多

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<script language="javascript">
function moveImage(){
if(window.event.button!=1){
return;
}
with(window.event.srcElement.style){
//重新设置图像在浏览器中的位置
pixelLeft=window.event.x-236/2-document.all.ImageDiv.offsetLeft;
pixelTop=window.event.y-118/2-document.all.ImageDiv.offsetTop;
}
window.event.returnValue=false;//取消系统拖动事件
}
</script>
</HEAD>

<BODY>
<div style="position:relative" id="ImageDiv">
<img id="image2" style="container:positioned;position:absolute;top:60px;left:250px;width:236px;height:108px;" src="booka.gif">
<img id="image2" style="container:positioned;position:absolute;top:60px;left:60px;width:236px;height:108px;" src="booka.gif" onmouseMove="moveImage()">
</div>
</BODY>
</HTML>

分享到：
| CodeSmith基础（八）
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    js放大缩小拖拽图片（兼容IE、火狐）

    2. **图片拖拽**：允许用户在页面上自由拖动图片。 3. **兼容性**：确保脚本可以在不同的浏览器环境下正常运行，特别是对于已经不再主流但仍然有用户使用的IE浏览器。 #### 代码解析 ##### 初始化图片位置 ```...

    ie9超级拖拽(亲测能用)

    在IE9中，这个特性允许用户通过拖动网页上的链接、图片或其他元素到桌面或另一程序窗口来实现快速保存、打开或分享内容。这一功能大大提升了浏览体验和工作效率。 首先，我们要理解什么是拖放技术。拖放是用户界面...

    让你的图片实现可以拖动的效果

    这段代码实现了一个功能，即让网页中的图片具备可拖动的效果。主要涉及到HTML、CSS和JavaScript三方面的知识。 首先，我们来看HTML部分。在这里，只有一个`&lt;img&gt;`标签用于显示图片，其`src`属性指定了图片的路径，`...

    可拖拽图片文本框（类似QQ发送消息框

    在IT行业中，尤其是在前端开发领域，可拖拽图片并将其转化为文本框内可编辑的base64编码是一项实用的功能。这种技术通常用于提高用户体验，比如在聊天应用、论坛或者在线编辑器中，用户可以直接通过拖放操作上传图片...

    js实现鼠标滚轮控制图片缩放效果的方法

    在如今的网络应用中，经常会遇到需要实现用户通过鼠标滚轮控制页面元素缩放的场景，例如图片查看器、地图应用等。本文将详细介绍如何使用JavaScript来实现通过鼠标滚轮控制图片缩放效果的方法，其中将涉及...

    JS实现列表图片拖拽排序效果特效源码.zip

    在JavaScript（JS）中实现列表图片的拖拽排序效果，是一种增强用户体验的常见技术，尤其适用于需要用户自定义顺序的场景。本项目提供了一个特效源码，帮助开发者创建具有动态反馈和流畅动画的拖放功能。以下是实现...

    jquery实现图片旋转(js实现)

    本文将深入探讨如何使用jQuery来实现图片旋转功能，并兼容IE、Firefox、Opera和Chrome等主流浏览器。 首先，要实现图片旋转，我们需要理解CSS3中的`transform`属性，尤其是`rotate()`函数。`rotate()`允许我们以...

    C# 实现类似傲游webbrowser超级拖拽 （此程序有些bug）

    - 图片拖拽则可能涉及到图像的抓取和转换，需要将图片数据包装成可拖放的数据对象。 - 当拖放到其他程序或桌面时，需要根据接收端的需求，提供合适的数据格式，如文本、URL或二进制数据。 5. **注意的问题和存在...

    Super Drag and Go for IE （超级拖拽for IE）

    1. **拖放功能增强**：Super Drag and Go使用户能够通过拖动网页上的链接、图片、文字等元素来实现快速打开新页面、保存文件、搜索信息等多种操作。例如，拖动链接到新的标签页可直接打开链接，拖动图片到桌面可快速...

    HTML5拖动条实现图片滚动浏览效果.rar

    HTML5拖动条实现图片滚动浏览效果，当运行本效果后，拖动底部的滚动条即可控制上面的图片滑动起来，可浏览到每一张图片，采用最新的HTML5移动设备技术，效果不错，本代码面向移动设备开发，在电脑上浏览需要Chrome或...

    sortable 图片排序 ，拖拽

    在本篇文章中，我们将深入探讨Sortable库以及如何在项目中实现图片排序和拖拽功能。 Sortable是一个轻量级的开源库，它基于HTML5的`draggable`和`data-*`属性，提供了跨浏览器的拖放排序解决方案。这个库不仅支持...

    用JS实现和google地图类似的图片查看器-----放大、缩小、移动和还原，都控制在div里，兼容ie,FF

    在本文中，我们将深入探讨如何使用JavaScript（JS）来创建一个类似于Google地图的图片查看器。这个查看器将具备放大、缩小、移动和还原图片的功能，并且能够在div容器内正常工作，同时兼容Internet Explorer（IE）和...

    js 拖动排序，文本拖动，图片拖动，支持移动端，兼容性好。

    实现图片拖动 图片拖放的实现与文本类似，只需将HTML元素替换为`&lt;img&gt;`标签，并设置适当的源URL。在`drop`事件处理函数中，可以通过`event.dataTransfer.files`获取到拖放的文件，然后利用FileReader API读取并...

    jquery全屏滑块拖动横向图片滚动.zip

    这种特效使得网页中的图片能够全屏显示，并且支持通过鼠标滚轮或直接拖动来实现横向的平滑滚动，为用户提供了沉浸式的浏览体验。在网页设计和开发中，这种滑块效果被广泛应用，尤其是在产品展示、摄影作品集或网站...

    用JS实现和google地图类似的图片查看器-放大、缩小、移动和还原，都控制在div里，兼容ie,FF

    为了实现图片的平移，我们需要监听鼠标事件，计算鼠标相对于图片左上角的位置，然后根据鼠标的移动调整图片的位置： ```javascript let offsetX = 0, offsetY = 0; container.addEventListener('mousedown', ...

    JS图片拖动裁剪代码.zip

    在JavaScript（JS）中实现图片拖动裁剪功能是一项常见的前端技术需求，它涉及到HTML、CSS和JavaScript的深度结合。这个"JS图片拖动裁剪代码.zip"压缩包可能包含了一个实现这一功能的完整示例。以下是这个技术点的...

    js动画图片拖动排序效果

    在JavaScript（JS）中实现图片拖动排序效果是一项常见的交互设计任务，它可以为用户带来更加直观和有趣的体验。本文将深入探讨如何利用JS技术来创建这样的功能，包括基本原理、核心代码以及可能遇到的问题和解决方案...

    H5实现拖动验证码.zip

    在这个拖动验证码中，用户需要将一个特定的图像或者标记拖动到正确的位置，以证明他们是真实的交互。这个过程既增加了安全性，又提高了用户参与度，相比传统的输入数字或点击图片的验证码方式，更具有互动性和趣味性...

    js实现覆盖层浏览图片及特效（可拖动） js封装成类库

    在实现图片浏览组件时，我们需要监听`mousedown`（鼠标按下）、`mousemove`（鼠标移动）和`mouseup`（鼠标释放）等事件，来追踪用户的拖动操作。例如： ```javascript element.addEventListener('mousedown', ...

    jquery拖拽图片排序

    "jquery拖拽图片排序"是一种交互式功能，允许用户通过拖放操作来改变图片或包含图片的div元素的顺序，从而实现自定义布局。这种功能在各种应用场景中都非常实用，比如相册管理、任务卡片排序等。 实现jQuery拖拽...

Magicbox
Global site tag (gtag.js) - Google Analytics