2012-12-25 2 views
1

페이지 중 하나를 제외하고 내 응용 프로그램의 모든 페이지에 고정 된 navbar를 성공적으로 구현했습니다. 이 페이지는 높이가 100 %이고 너비가 100 % 인 iframe을 포함합니다.Jquery Mobile - iframe에서 스크롤 한 후 Navbar가 고정되지 않음

페이지를로드 할 때 모든 것이 정상입니다.

What is should be always like

나는 모든 것이 여전히 정상적인 이동합니다.

그러나 다음, 나는 iframe이 내부 링크를

을 클릭 한 다음 나는, 네비게이션 바에을 스크롤 headerbar 스크롤하는 동안 더 이상 고정되지 않습니다. 그리고 나서 그들은 그들의 위치로 돌아갑니다. 여기 enter image description here

<!DOCTYPE html> 
<html> 
<head> 
<title>My Page</title> 
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> 
    <link rel="stylesheet" href="css/jqm-icon-pack-2.1.2-fa.css" /> 
    <link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" /> 
    <script src="http://code.jquery.com/jquery-1.8.2.min.js"></script> 
    <script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script> 
</head> 
<body> 
<div data-role="page" id="boutique"> 
    <div data-role="header" data-position="fixed" data--tap-toggle="true"> 
     <h1>Boutique</h1> 
    </div> 
    <div data-role="content" style="padding:0px"> 
     <iframe style="width:100%; height:100%; border:0px; margin:0px" src="http://autotech.gazoline.net/index.php?mobile_theme_ok" rel="external"> 
     </iframe> 
    </div> 
    <div data-role="footer" data-id="myfooter" data-transition="pop" data-position="fixed" data-tap-toggle="true"> 
    <div data-role="navbar" data-grid="b"> 
    <ul> 
     <li><a href="#articles" data-icon="file">Articles</a></li> 
     <li><a href="#videos" data-icon="play">Vid&eacute;os</a></li> 
     <li><a class="ui-btn-active ui-state-persist" href="#boutique" data-icon="shopping-cart">Boutique2</a></li> 
    </ul> 
    </div> 
</div> 
</div> 

답변

0

내가 헤더에이 속성이

data--tap-toggle="true" 

바닥 글

data-tap-toggle="true" 

로 작성해야 할 생각 당신을 도움이되는 몇 가지 코드 또한이 코드를 작성할 필요가 없습니다. 왜냐하면 de 당신이 때 클릭을 전환하지 않으려면 케이스를 비난하는 것은 "true"로, 당신은

안부

+0

안녕하세요, 답변 주셔서 감사합니다 그것을 "false"를해야합니다. 이전에 false로 설정했기 때문에이 코드가 있습니다. –

+0

올바른 형식으로 false로 설정 한 후에 어떤 일이 발생 했습니까? 문제가 해결 되었습니까? –

+0

아니요. 문제가 해결되지 않았습니다. 나는 이것을 구현하려고 시도했다 : [link] (http://outof.me/native-scrolling-in-jquery-mobilephonegap-applications/) 거의 효과가 있었지만 아직 그렇지 않다. 그래서 지금은이 페이지를 숨기고 있습니다. ( –

관련 문제