Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    text
    copied!<p>Right click on the 20% space you left at the bottom of the page. My bet is that the App Bar will show up. When you were swiping your finger at the bottom, you were touching the parent page so the App Bar shows up, but when you right click in the iframe the right click is not detected as an event on the parent page, so the App Bar does not show up.</p> <p>In these scenarios, you will have to go with fragment navigation rather than the iframe navigation which you were using.</p> <p>EDIT:<br/> Assume the following <strong>html</strong> is in the body tag of default.html. <br/> <strong>"contentHost"</strong> div will be where you will load your pages(even the initial page)<br/> The App Bar will exist on this page also.</p> <pre><code>&lt;div id="contentHost"&gt; &lt;/div&gt; &lt;div id="trafficTipsAppBar" data-win-control="WinJS.UI.AppBar" data-win-options="{position:'bottom',transient:true,autoHide:0,lightDismiss:true}"&gt; &lt;div class="win-right"&gt; &lt;button class="win-command" id="settingsButton"&gt; &lt;span style="background-image: url('images/smalllogo.png')" class="win-commandicon"&gt;&lt;/span&gt; &lt;span class="win-label"&gt;Settings&lt;/span&gt; &lt;/button&gt; &lt;/div&gt; &lt;/div&gt; </code></pre> <p>The default.js will look like the following. <br/> You can use the <strong>"navigated"</strong> function as it is.<br/> Also include this line <strong>WinJS.Navigation.addEventListener('navigated', navigated);</strong><br/> You will notice that on <strong>WinJS.Application.onmainwindowactivated</strong> we are navigating to <strong>"main.html"</strong> fragment, this is the initial load. You can create this by using "Add new item" > Fragment.<br/> Also, when we click the "settings" button in the App Bar we will navigate to <strong>"settings.html"</strong> fragment</p> <pre><code>(function () { 'use strict'; // Uncomment the following line to enable first chance exceptions. // Debug.enableFirstChanceException(true); document.addEventListener("DOMContentLoaded", function () { WinJS.UI.processAll(); }, false); WinJS.Application.onmainwindowactivated = function (e) { if (e.detail.kind === Windows.ApplicationModel.Activation.ActivationKind.launch) { WinJS.Navigation.navigate('main.html'); var settingsButton = document.getElementById('settingsButton'); settingsButton.addEventListener('click', function () { WinJS.Navigation.navigate('settings.html'); }); } } function navigated(e) { WinJS.UI.Fragments.clone(e.detail.location, e.detail.state) .then(function (frag) { var host = document.getElementById('contentHost'); host.innerHTML = ''; host.appendChild(frag); document.body.focus(); WinJS.Application.queueEvent({ type: 'fragmentappended', location: e.detail.location, fragment: host, state : e.detail.state }); }); } WinJS.Navigation.addEventListener('navigated', navigated); WinJS.Application.start(); })(); </code></pre>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload