头＆放大器;在index.html页面调用外部HTML页面时页脚positons不固定？ [英] header & footer positons not fixed when calling external HTML page in index.html page?
问题描述
我有一个头与放大器的问题;页脚而在jQuery Mobile的调用一个外部的HTML页面在我的index.html页面。这里是我下面的示例code .........
I have a problem with header & footer while calling one external html page in my index.html page in jquery mobile. Here is the sample code which i am following.........
index.html的
index.html
<section id="main" data-role="page">
<header data-role="header">
</header>
<div data-role="content" class="mainScreen">
<a href="#single" data-theme="e" data-role="button" >Single</a>
<a href="sample.html" data-theme="e" data-role="button">Sample</a>
<a href="#faq" data-transition="slide" data-theme="e"data-role="button">FAQ</a>
</div>
</section>
<section id="single" data-role="page">
<header data-role="header">
<div>..</div>
<footer data-role="footer">
</section>
<section id="faq" data-role="page">
<header data-role="header">
<div>..</div>
<footer data-role="footer">
</section>
main.js
main.js
$("header").attr("data-position","fixed").attr("data-tap-toggle","false");
$("footer").attr("data-position","fixed").attr("data-tap-toggle","false");
sample.html
sample.html
<html>
<head>......</head>
<body>
<section id="sample" data-role="page">
<header data-role="header">
<div>..</div>
<footer data-role="footer">
</section>
</body>
</html>
在上面的index.html页面调用#single＆安培时; #faq常见，页眉和页脚是由固定其位置正确显示但当sample.html（外部HTML页）被称为页眉和页脚位置固定位置不显示。他们被感动。任何人都可以请解决售后服务我的问题。
In the above index.html page when calling "#single" & "#faq", the header and footer are displaying correctly by their positions fixed but when sample.html (external HTML page) was called header and footer position are not displaying in fixed positions. they are moving. Can anyone please slove my problem.
推荐答案
问题在于，您所呼叫的ATTR（）方法的时机。您需要绑定到pagebeforecreate。您的页眉和页脚的属性JQM之前设置这种方式增强您的标记。即。
The issue lies in the timing that you are calling your attr() method. You need to bind to pagebeforecreate. This way your header and footer attributes are set before JQM enhances your markup. i.e.
$(document).on('pagebeforecreate', function(){
$("header").attr("data-position","fixed").attr("data-tap-toggle","false");
$("footer").attr("data-position","fixed").attr("data-tap-toggle","false");
});
注意：如果您的jQuery版本为pre 1.7使用绑定或委托，而不是在（）
Note: If your jQuery version is pre 1.7 use bind or delegate instead of on()
这篇关于头＆放大器;在index.html页面调用外部HTML页面时页脚positons不固定？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
