JqueryUI Draggable在IE中不起作用? [英] JqueryUI Draggable not working in IE?
问题描述
我正在使用JQueryUI来帮助解决此页面上的可移动项:
I'm using JQueryUI to help with the moveable items on this page:
如果向下滚动，您会看到可以抓住并在我的脸上方移动的png图像，以创建Mr. PotatoHead字体效果.
If you scroll down, you'll see the png's that you can grab and move over my face to create a Mr. PotatoHead type effect.
我知道这不是世界上最漂亮的代码，但是它在除Internet Explorer之外的所有浏览器上都能很好地工作.
I know it's not the prettiest code in the world, but it is working great on every browser, except Internet Explorer.
有人知道有一个修复程序来帮助这些项目在IE中拖动吗?
Does anyone know a fix to help these items become draggable in IE?
以下是没有Google Analytics(分析)或元数据的代码:
Here's the code without the Google Analytics or Meta:
<link rel="stylesheet" type="text/css" href="css/swagger.css" />
<!-- Draggable Pics -->
<script type="text/javascript"
src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript"
src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.js"></script>
<link rel="stylesheet" type="text/css"
href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.1/themes/base/jquery-ui.css"/>
<!-- end Draggable Pics -->
</head>
<body>
<div id="wrapper3">
<div id="coverleftside1">
<div id="dave3">
<img src="images/dave3.png" alt="David Lee Waring, a Graphic and Web Designer in Orlando, FL">
</div>
</div>
<div id="coverrightside1">
</div>
<div class="clear">
</div>
<div id="sig">
<img src="images/logo2.png" alt="David Lee Waring, a Graphic and Web Designer in Orlando, FL">
</div>
<div id="nav3">
<ul>
<li><a href="http://www.hiredavewaring.com/index.html" >Home</a></li>
<li><a href="http://www.hiredavewaring.com/about.html" >About</a></li>
<li><a href="http://www.hiredavewaring.com/design.html" >Portfolio</a></li>
<li><a href="http://www.hiredavewaring.com/contact.html" >Contact</a></li>
<li><a href="http://www.hiredavewaring.com/blog" >Blog</a></li>
</ul>
</div>
<p>Grafiti Time! Click on an image below and drag it over Dave's face. Send us a screen shot of your favorite combination.</p>
<a href="http://www.hiredavewaring.com"> Click Here to reset and start over. </a>
<div class="draggable">
<div class="demo"><img src="images/funnyface/glassesnose.png" alt="Move me over Dave's Face!" ></div>
<div class="demo2"><img src="images/funnyface/beard1.png" alt="Move me over Dave's Face!" ></div>
<div class="demo3"><img src="images/funnyface/beard2.png" alt="Move me over Dave's Face!" ></div>
<div class="demo4"><img src="images/funnyface/beard3.png" alt="Move me over Dave's Face!" ></div>
<div class="demo5"><img src="images/funnyface/must1.png" alt="Move me over Dave's Face!" ></div>
<div class="demo6"><img src="images/funnyface/must2.png" alt="Move me over Dave's Face!" ></div>
<div class="demo7"><img src="images/funnyface/eyesangry.png" alt="Move me over Dave's Face!" ></div>
<div class="demo8"><img src="images/funnyface/eyescross.png" alt="Move me over Dave's Face!" ></div>
<div class="demo9"><img src="images/funnyface/eyesgoogle.png" alt="Move me over Dave's Face!" ></div>
<div class="demo10"><img src="images/funnyface/eyesscared.png" alt="Move me over Dave's Face!" ></div>
</div>
<SCRIPT>
$(function(){
$('.demo')
.draggable();
});
$(function(){
$('.demo2')
.draggable();
});
$(function(){
$('.demo3')
.draggable();
});
$(function(){
$('.demo4')
.draggable();
});
$(function(){
$('.demo5')
.draggable();
});
$(function(){
$('.demo6')
.draggable();
});
$(function(){
$('.demo7')
.draggable();
});
$(function(){
$('.demo8')
.draggable();
});
$(function(){
$('.demo9')
.draggable();
});
$(function(){
$('.demo10')
.draggable();
});
</SCRIPT>
<!-- End Draggable -->
</div>
</body>
</html>
谢谢， 戴夫
推荐答案
首先，我将您的代码限制为单个$(function(){});.
Firstly, I would limit your code to a single $(function(){});.
$(function(){
$('.demo').draggable();
$('.demo2').draggable();
$('.demo3').draggable();
$('.demo4').draggable();
$('.demo5').draggable();
$('.demo6').draggable();
$('.demo7').draggable();
$('.demo8').draggable();
$('.demo9').draggable();
$('.demo10').draggable();
});
更重要的是，draggable 需要jQuery UI 1.8.6 或更高版本才能在IE9中工作.还有一个补丁适用于旧版本，但我真的建议升级.
More importantly, draggable requires jQuery UI 1.8.6 or greater to work in IE9. There is also a patch available for older version, but I would really recommend upgrading.
这篇关于JqueryUI Draggable在IE中不起作用?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
