在jQuery Mobile中隐藏标题

在我的jQuery Mobile应用程序（MVC4模板）中，我需要完全隐藏特定页面上的标题（它有一张我想填满屏幕的地图）。为了做到这一点，我认为标题需要将数据全屏属性设置为“true”。在jQuery Mobile中隐藏标题

我管理按照此问题给出的建议实现上述在一定程度上： -

How to set header to full screen mode in jQuery Mobile?

然而，它仅工作，如果报头具有与数据全屏属性被设置为“真正的“，这是不希望的，因为它会导致标题”跳跃“，当它加载每个页面时，从全屏幕变为固定，也因为我只希望标题全屏\隐藏在一页上，其余页面头只需要保持不变。

这里是（在头与数据全屏设置为true）预期的效果： -

http://jsfiddle.net/Gajotres/HCcUe/

在这里，你可以看到它不工作，如果你没有数据全屏=“真”

http://jsfiddle.net/sidd92/QcgMZ/

这是我自己的代码至今： -

_la yout.cshtml

<div id="Index" data-role="page">       
    <div data-role="header" data-theme="b" data-position="fixed" data-fullscreen="true" id="dvHeader"> 
     <div id="logo"></div>           
    </div>   
    <div data-role="header" data-theme="a"> 
     <a id="btnGlobalBack" data-role="button" data-icon="back" style="display:none;">Back</a> 
     <h1>@ViewBag.Title</h1> 
    </div> 

    <div id="mainContent" data-role="content" page_name="test">           
     @RenderBody() 
     @RenderSection("BodyScriptsSection", required: false)   
    </div>    
    <div data-role="footer" data-position="fixed" data-tap-toggle="false"> 
     @RenderSection("Footer")     
    </div><!-- /footer -->         
</div>

的script.js

$(document).on("click", "#btnEnableFullscreenAndHide", function() { 
     $("#dvHeader").attr({ 'data-fullscreen': 'true', 'data-position': 'fixed' }) 
     .removeAttr('out') 
     .addClass('ui-header-fixed') 
     .removeAttr('reverse') 
     .addClass('ui-header-fullscreen') 
     .addClass('slidedown') 
     .addClass('out') 
     .addClass('reverse'); 
    }); 

    $(document).on("click", "#btnBackToFixed", function() { 
     $("#dvHeader").removeAttr('data-fullscreen') 
     .removeClass('ui-header-fullscreen') 
     .removeClass('ui-header-fixed') 
     .removeClass('slidedown') 
     .addClass('out') 
     .addClass('reverse'); 
    });

来源

2013-02-14 pλul

此代码似乎正常工作。我只在Chrome中测试过你。

<div data-role="page" id="home"> 

    <div data-role="header" data-fullscreen="true"> 
    </div><!-- /header --> 

    <div data-role="content" class="infobox"> 
     <p>I'm first in the source order so I'm shown as the page.</p> 
     <p>View internal page called <a href="#bar">bar</a></p> 
    </div><!-- /content --> 

</div><!-- /page -->

因此，尝试对特定页面上删除固定属性，并确保data-role="header"div完全是空的。

来源

2013-03-06 18:15:23

在jQuery Mobile中隐藏标题

回答

相关问题