Home >Web Front-end >HTML Tutorial >Please experts modify this code to support IE6/IE7_html/css_WEB-ITnose
Please experts modify this code to support IE6/IE7_html/css_WEB-ITnose
- WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOriginal
- 2016-06-24 12:15:18921browse
<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>HTML5 javascript 简单拖拽代码示例</title><script language="javascript">function DraggAble(obj){ obj.draggable = true; this.drag_start = function(e) { e.dataTransfer.effectAllowed='move'; e.dataTransfer.dropEffect='move'; e.dataTransfer.setData("Text", e.target.getAttribute('id')); e.dataTransfer.setDragImage(e.target,0,0); return true; } obj.ondragstart = this.drag_start;}function DropAble(obj){ obj.draggable = true; this.drag_drop = function(e){ e.target.appendChild(document.getElementById(e.dataTransfer.getData('Text'))); return false; } this.drag_over = function(e){ return false; } obj.ondrop = this.drag_drop; obj.ondragover = this.drag_over;}</script></head><body> <div style="width:200px; height:200px; background-color:#CC33CC; float:left" id="box4" ondrop="alert(1)" > 主区域<div style="width:100px; height:100px; background-color:#09F;" id="obj" ondrop="alert(1)" > 可以把我拖拽到不同的区域哦！ </div> </div> <div style="width:200px; height:200px; background-color:#CCC; float:left" id="box1" ondrop="alert(1)" > 区域1 </div> <div style="width:200px; height:200px; background-color:#F00; float:left" id="box2" ondrop="alert(1)" > 区域2 </div> <div style="width:200px; height:200px; background-color:#666; float:left" id="box3" ondrop="alert(1)" > 区域3 </div><script language="javascript">DraggAble(document.getElementById("obj"));DropAble(document.getElementById("box1"));DropAble(document.getElementById("box2"));DropAble(document.getElementById("box3"));DropAble(document.getElementById("box4"));</script></body></html> Currently this code can support Firefox and Google Chrome, but it is not compatible with IE core browsers.
Reply to discussion (solution)
Jquery ui also has a drag and drop function, which can be dragged and dropped, but it is not convenient for direct typesetting, or it can be fine-tuned or automatically Alignment method?
The title is ambiguous, sorry!
It does not support IE now, I hope it can be modified to support IE6 and IE7
Statement：
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn