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>