したがって、私たちが抱えている問題は次のとおりです。
<div id="navButtons">
ドキュメントのスクロールを開始するときに非表示にする必要があります。スクロールを停止すると、同じdivが表示されるはずです。
http://jsfiddle.net/zsnfb/9/のリンクで動作していますが、Windows8アプリケーション(MS Expression Blendを使用)に適用しようとすると、動作しません。起動時にアプリがクラッシュします。
PS必要なすべての.jsを含め、それらを参照しました。
現在、この指示に従っていますhttp://blog.adamroderick.com/2011/09/jquery-in-a-windows-8-application/残念ながら、機能しません
これがコードです
(function() {
"use strict";
// This function is called whenever a user navigates to this page. It
// populates the page elements with the app's data.
function ready(element, options) {
// TODO: Initialize the fragment here.
var b1 = element.querySelector("#ScrollableSection");
b1.addEventListener("mousedown", function(e) {
var buttons = element.querySelector(".visible");
buttons.className = "transparent";
});
}
function ready(element, options) {
var b2 = element.querySelector("#button1");
b2.addEventListener("click", function(e) {
var buttons2 = element.querySelector(".transparent");
buttons2.className = "visible";
});
}
WinJS.UI.Pages.define("/html/homePage.html", {
ready: ready
});
WinJS.Application.start();
$(document).ready(function) {
var $menu = $("#navButtons");
var opacity = $menu.css("opacity");
var scrollStopped;
var fadeInCallback = function() {
if (typeof scrollStopped != 'undefined') {
clearInterval(scrollStopped);
}
scrollStopped = setTimeout(function() {
$menu.animate({
opacity: 1
}, "fast");
}, 300);
}
$(window).scroll(function() {
if (!$menu.is(":animated") && opacity == 1) {
$menu.animate({
opacity: 0
}, "fast", fadeInCallback);
} else {
fadeInCallback.call(this);
}
});
});
})();