与此相关 wrapper function bracketing 问题
Rion和Jan足以使该脚本正常工作,但它只能运行一段时间(并且与添加的行完全无关)所以看起来原始代码失败了,我假设这是我做的这个FB风格的东西似乎到处都是。当用户滚动到页面底部时,它会“破坏”代码。我猜内容区的类正在改变?我对这种东西非常环保。
如果由于jquery无法工作,没有大问题,Showmenu点击工作,刷卡效果真是太棒了,保留很好,因为网站基于1.6.4我真的不我想重新做这一切。
这是代码
$(document).bind("mobileinit", function () {
$.mobile.pushStateEnabled = true;
});
$(function () {
var menuStatus;
// 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, .pages').live("swipeleft", function () {
if (menuStatus) {
$(".ui-page-active").animate({
marginLeft: "0px",
}, 300, function () {
menuStatus = false
});
}
});
$('.pages').live("swiperight", function () {
if (!menuStatus) {
$(".ui-page-active").animate({
marginLeft: "165px",
}, 300, function () {
menuStatus = true
});
$("html, body").animate({ scrollTop: 0 }, "slow");
}
});
and the HTML
<!DOCTYPE html>
<html manifest="island.manifest">
<head>
<title></title>
<meta id="extViewportMeta" name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
<link rel="stylesheet" href="css/jquery.mobile-1.0rc2.min.css" />
<link rel="stylesheet" href="css/main.css" />
<link rel="stylesheet" href="js/flexslider/flexslider.css" type="text/css" media="screen"/>
<!--webapp stay-->
<!--test-->
<link rel="apple-touch-icon" href="images/add-to-home/touch-icon-iphone.png"/>
<link rel="apple-touch-icon-precomposed" href="images/add-to-home/touch-icon-iphone.png"/>
</head>
<body>
<div id="menu">
<ul>
<li><a target="_blank" href="" class="noeffect" style="height:50px;border-right:none;padding:15px;background:#075191;"><img src="images/YouIn.png" width="120"></a></li>
<li><a href="index.html" class="contentLink" rel="external" >Main </a></li>
<li><a href="nav_2.html" class="contentLink" rel="external" >January 30, 2013</a></li>
<li class="active"><a href="nav_3.html" class="contentLink" rel="external" style="border-right:solid 0px #9a9999" >January 31, 2013 </a></li>
<li><a href="nav_4.html" class="contentLink" rel="external" >February 1, 2013 </a></li>
<li><a href="nav_5.html" class="contentLink" rel="external" >February 2, 2013</a></li>
<li><a href="nav_6.html" class="contentLink" rel="external" style="color:red;text-align:center">Game Day!!!</a></li>
<li><a href="nav_7.html" class="contentLink" rel="external" >February 4, 2013 </a></li>
<li><a href="nav_8.html" class="contentLink" rel="external" >Map </a></li>
<li><a href="nav_9.html" class="contentLink" rel="external" >Contact Staff </a></li>
<li><a target="_blank" href="" class="noeffect" style="min-height:300px;border-top:solid 1px #3c7db3;padding:250px 0 0 15px;background:#075191;"><img src="images/YouIn.png" width="120"></a></li>
</ul>
</div>
<div data-role="page" class="pages" id="home">
<div data-role="header" style="min-height: 80px; background:#075191; ">
<span><a href="#" class="showMenu" style="float:left;margin:10px 10px 10px 10px;"><img src="images/MenuPSD3C.png" height= "64"></a></span>
<span ><a href="index.html" style="float:right;margin:10px 10px 10px 10px;"><img src="images/add-to-home/touch-icon-iphone.png" height= "64" ></a></span>
</div><!-- /header -->
<div data-role="content" style="min-height:1400px;border-top:solid #b2b3b5 1px">
content stuff
</div><!-- /content -->
</div><!-- /page -->
<script type="text/javascript" src="js/jquery-1.6.4.min.js"></script>
<script type="text/javascript" src="js/jquery.mobile-1.0rc2.min.js"></script>
<script type="text/javascript" src="js/app.js"></script>
<script type="text/javascript">
function fullscreen() {
$('a').click(function() {
if(!$(this).hasClass('noeffect')) {
window.location = $(this).attr('href');
return false;
}
});
}
fullscreen();
</script>
</body>
</html>
答案 0 :(得分:0)
在你的jquery ref之后插入
<script type="text/javascript">
(function (window) {
// This library re-implements setTimeout, setInterval, clearTimeout, clearInterval for iOS6.
// iOS6 suffers from a bug that kills timers that are created while a page is scrolling.
// This library fixes that problem by recreating timers after scrolling finishes (with interval correction).
// This code is free to use by anyone (MIT, blabla).
// Original Author: rkorving@wizcorp.jp
var timeouts = {};
var intervals = {};
var orgSetTimeout = window.setTimeout;
var orgSetInterval = window.setInterval;
var orgClearTimeout = window.clearTimeout;
var orgClearInterval = window.clearInterval;
// To prevent errors if loaded on older IE.
if (!window.addEventListener) return false;
function createTimer(set, map, args) {
var id, cb = args[0],
repeat = (set === orgSetInterval);
function callback() {
if (cb) {
cb.apply(window, arguments);
if (!repeat) {
delete map[id];
cb = null;
}
}
}
args[0] = callback;
id = set.apply(window, args);
map[id] = {
args: args,
created: Date.now(),
cb: cb,
id: id
};
return id;
}
function resetTimer(set, clear, map, virtualId, correctInterval) {
var timer = map[virtualId];
if (!timer) {
return;
}
var repeat = (set === orgSetInterval);
// cleanup
clear(timer.id);
// reduce the interval (arg 1 in the args array)
if (!repeat) {
var interval = timer.args[1];
var reduction = Date.now() - timer.created;
if (reduction < 0) {
reduction = 0;
}
interval -= reduction;
if (interval < 0) {
interval = 0;
}
timer.args[1] = interval;
}
// recreate
function callback() {
if (timer.cb) {
timer.cb.apply(window, arguments);
if (!repeat) {
delete map[virtualId];
timer.cb = null;
}
}
}
timer.args[0] = callback;
timer.created = Date.now();
timer.id = set.apply(window, timer.args);
}
window.setTimeout = function () {
return createTimer(orgSetTimeout, timeouts, arguments);
};
window.setInterval = function () {
return createTimer(orgSetInterval, intervals, arguments);
};
window.clearTimeout = function (id) {
var timer = timeouts[id];
if (timer) {
delete timeouts[id];
orgClearTimeout(timer.id);
}
};
window.clearInterval = function (id) {
var timer = intervals[id];
if (timer) {
delete intervals[id];
orgClearInterval(timer.id);
}
};
//check and add listener on the top window if loaded on frameset/iframe
var win = window;
while (win.location != win.parent.location) {
win = win.parent;
}
win.addEventListener('scroll', function () {
// recreate the timers using adjusted intervals
// we cannot know how long the scroll-freeze lasted, so we cannot take that into account
var virtualId;
for (virtualId in timeouts) {
resetTimer(orgSetTimeout, orgClearTimeout, timeouts, virtualId);
}
for (virtualId in intervals) {
resetTimer(orgSetInterval, orgClearInterval, intervals, virtualId);
}
});
}(window));
</script>