0
本示例使用mootools，但我看到与scriptaculous相同的行为。IE7中的可拖动div问题
我有一些div的内容，在这种情况下，一个单一的X和内容周围有大量的空白。我让div可以拖动，但是我发现很难在IE中拖动div。在IE中，我需要直接点击并拖动div的内容，即单个X.如果我点击div，但是离开X，div就坐在那里。
它在FF，Chrome和Safari中的行为与预期相同。
这是一个使用mootools的完整工作示例。您必须更新脚本标记以反映您为mootools库命名的内容。 （上编辑我添加了一个Scriptaculous的例子以及）
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en" >
<head>
<title>Mootools problem</title>
<script type="text/javascript" src="mootools.js"></script>
<script type="text/javascript" src="mootools-more.js"></script>
<style type="text/css">
#my-drag{
width: 100px;
height: 100px;
border: solid 1px black;
}
#my-drag p{
text-align: center;
}
</style>
<script type="text/javascript">
function start() {
var e = $('my-drag');
e.makeDraggable();
}
</script>
</head>
<body onload="start();">
<div id="my-drag">
<p>X</p>
</div>
</body>
</html>
下面是一个使用原型Scriptaculous的相同的例子 - 同一个问题
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en" >
<head>
<title>IE Drag problem</title>
<script type="text/javascript" src="prototype.js"></script>
<script type="text/javascript" src="scriptaculous.js"></script>
<script type="text/javascript" src="effects.js"></script>
<script type="text/javascript" src="dragdrop.js"></script>
<style type="text/css">
#my-drag{
width: 100px;
height: 100px;
border: solid 1px black;
}
#my-drag p{
text-align: center;
}
</style>
<script type="text/javascript">
function start() {
new Draggable('my-drag', { starteffect: null, endeffect: null }); ;
}
</script>
</head>
<body onload="start();">
<div id="my-drag">
<p>X</p>
</div>
</body>
</html>