jQuery移动在底部有一个意想不到的动画
jQuery移动在底部有一个意想不到的动画
提问于 2012-08-13 12:18:04
我没有做任何应该让它在加载单词的情况下将屏幕动画化的事情，但是当我把手指向上滑到屏幕上时，我就像一个显示单词的底部工具栏/页脚：
正在加载
这是我的代码，您将看不到任何显示加载的内容。
JS文件
$(document).bind("mobileinit", function(){
//$.mobile.pushStateEnabled = true;
//$.mobile.hidePageLoadingMsg();
});
$(function(){
var menuStatus;
$("#content").animate({
marginLeft: "165px",
}, 300, function(){menuStatus = true});
// Show menu
$("a.showMenu").click(function(){
if(menuStatus != true){
$(".ui-page-active").animate({
marginLeft: "165px",
}, 300, function(){menuStatus = true});
return false;
} else {
$(".ui-page-active").animate({
marginLeft: "0px",
}, 300, function(){menuStatus = false});
return false;
}
});
$('#menu, #content').live("swipeleft", function(){
if (menuStatus){
$("#content").animate({
marginLeft: "0px",
}, 300, function(){menuStatus = false});
}
});
$('#content').live("swiperight", function(){
if (!menuStatus){
$("#content").animate({
marginLeft: "165px",
}, 300, function(){menuStatus = true});
}
});
}); HTML文件
<!DOCTYPE html>
<html>
<head>
<title>SITE</title>
<link rel="stylesheet" href="css/main.css" />
<script type="text/javascript" src="js/jquery-1.6.4.min.js"></script>
<script src="http://code.jquery.com/mobile/1.0.1/jquery.mobile-1.0.1.min.js"></script>
<script type="text/javascript" src="js/jmobile-animate.js"></script>
<script type="text/javascript" src="js/app.js"></script>
<script type="text/javascript" src="cordova-2.0.0.js"></script>
</head>
<body>
<div id="menu">
<ul>
<li class="active"><a href="#home" class="contentLink">Dashboard <span class="icon"></span></a></li>
<li><a href="#page1" class="contentLink">Subpage 1 <span class="icon"></span></a></li>
<li><a href="#page2" class="contentLink">Subpage 2 <span class="icon"></span></a></li>
<li><a href="#page3" class="contentLink">Subpage 3 <span class="icon"></span></a></li>
</ul>
</div>
<div id="content">
<div class="hbg"><img src="images/small-logo.png" style="display:block;margin:2px auto 0 auto;"/></div>
</div>
</body>
<div data-role="footer" id="footer">
<h4>© 2012 SITE</h4>
</div>
</html>回答 2
Stack Overflow用户
回答已采纳
发布于 2012-08-14 06:41:58
我看到您已经包含了jquery移动js.So，我假设您确实需要一些jquery移动功能，尽管我没有在jquery移动js中看到jquery移动特定属性，例如data-role="page",data-role="content“等等，但是您也必须使用jquery移动css。
在加载main.css之前添加这一行
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0.1/jquery.mobile-1.0.1.min.css" />或者，如果不需要jquery移动功能，则可以删除jquery移动js的脚本标记。
刚刚注意到，您的code.The页脚div中的另一件事是身体外的tag.Please，如果这是无意的，在body标记中添加它。
Stack Overflow用户
发布于 2012-08-14 01:18:52
替换
<script type="text/javascript" src="js/jquery-1.6.4.min.js"></script>
<script src="http://code.jquery.com/mobile/1.0.1/jquery.mobile-1.0.1.min.js"></script>使用
<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.0.js"></script>
<script src="http://code.jquery.com/mobile/1.1.1/jquery.mobile-1.1.1.js"></script>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/11934146
复制相关文章
相似问题
腾讯云开发者
