jsp中使用js随意移动图片位置效果

最新推荐文章于 2021-01-12 08:15:37 发布

jinchun1234

最新推荐文章于 2021-01-12 08:15:37 发布

阅读量3.3k

点赞数

分类专栏： Javascript JSP 文章标签： jsp html function null java

本文链接：https://blog.csdn.net/jinchun1234/article/details/4301139

版权

本文展示了如何在JSP页面中利用JavaScript实现图片的拖动效果，包括限制图片在边框内的移动以及允许图片移出边框。通过设置ondragstart、ondrag、ondragend事件处理函数，结合鼠标坐标和图片位置动态调整图片的位置。

摘要由CSDN通过智能技术生成

带边框的，只能在边框内移动

<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
</head>
<body>
<script>
var xx = 0, yy =0
</script>
<div id=woyingjie
style="position: absolute; top: 0px; left: 0px; width: 1000px; height: 600px; background: green;"></div>
<img src="ys.gif" style='position: