我有通知div(divNotify)
,其中包含一些信息和主页中的计时器
Protected Sub Timer_Tick(ByVal sender As Object, ByVal e As System.EventArgs) Handles Timer1.Tick
Try
Me.GetNotification_Stats()
ScriptManager.RegisterClientScriptBlock(Me.Page, GetType(String), "Alert", "Show_NotifyDiv();", True)
Catch ex As Exception
Me.lblError.Visible = True
Me.lblError.InnerText = ex.Message
End Try
End Sub
divNotify
会在某段时间内显示
在这里我需要当用户最小化浏览器时,他将通过闪烁浏览器和更改浏览器的颜色来通知
但首先我如何知道浏览器是否在javasript中被最小化 这里我使用jquery show div标签
function Show_NotifyDiv() {
$("#div_NotificationOuter").show(1000);
$("#div_NotificationOuter").animate({ bottom: '+=30px' }, 4000);
}
答案 0 :(得分:5)
无法通过JavaScript查看页面是否最小化,但您可以使用 Visibility API 来确定页面是否可见用户与否。
目前可在Chrome,Mozilla和IE10中使用。
答案 1 :(得分:1)
除了c69的答案之外,我还建议使用图书馆isVisible。 它具有访问W3C页面可见性API的实用程序功能,您不必担心跨浏览器支持(统一moz或webkit前缀函数)
答案 2 :(得分:0)
也许检查窗口的大小?我只是在猜测。
答案 3 :(得分:0)
我们会耐心等待,但能见度即将到来: W3C defines the visibility state
答案 4 :(得分:0)
页面可见性API 提供了一些事件,您可以观察这些事件以了解文档何时可见或隐藏,还提供了查看页面当前可见性状态的功能。
注释:页面可见性API对于保存特别有用 资源,并通过避免页面执行来提高性能 文档不可见时不必要的任务。
当用户最小化窗口或切换到另一个选项卡时,API将发送visibilitychange事件,以使侦听器知道页面的状态已更改。您可以检测到事件并执行某些操作或表现不同。例如,如果您的Web应用正在播放视频,则可以在用户将标签置于后台时暂停视频,并在用户返回至标签时恢复播放。用户不会在视频中失去自己的位置,视频的配乐不会干扰新“前景”选项卡中的音频,同时用户也不会错过任何视频。
用例
让我们考虑页面可见性API的一些用例。
历史上,开发人员使用不完善的代理来检测此问题。例如,监视窗口上的模糊和焦点事件可以帮助您知道页面不是活动页面,但是并不能告诉您页面实际上对用户是隐藏的。 Page Visibility API解决了此问题。
示例
查看live example(带声音的视频)。
该示例使用以下代码创建:该示例在您切换到另一个标签时暂停视频,并在返回其标签时再次播放。
// Set the name of the hidden property and the change event for visibility
var hidden, visibilityChange;
if (typeof document.hidden !== "undefined") { // Opera 12.10 and Firefox 18 and later support
hidden = "hidden";
visibilityChange = "visibilitychange";
} else if (typeof document.msHidden !== "undefined") {
hidden = "msHidden";
visibilityChange = "msvisibilitychange";
} else if (typeof document.webkitHidden !== "undefined") {
hidden = "webkitHidden";
visibilityChange = "webkitvisibilitychange";
}
var videoElement = document.getElementById("videoElement");
// If the page is hidden, pause the video;
// if the page is shown, play the video
function handleVisibilityChange() {
if (document[hidden]) {
videoElement.pause();
} else {
videoElement.play();
}
}
// Warn if the browser doesn't support addEventListener or the Page Visibility API
if (typeof document.addEventListener === "undefined" || hidden === undefined) {
console.log("This demo requires a browser, such as Google Chrome or Firefox, that supports the Page Visibility API.");
} else {
// Handle page visibility change
document.addEventListener(visibilityChange, handleVisibilityChange, false);
// When the video pauses, set the title.
// This shows the paused
videoElement.addEventListener("pause", function(){
document.title = 'Paused';
}, false);
// When the video plays, set the title.
videoElement.addEventListener("play", function(){
document.title = 'Playing';
}, false);
}