js判断浏览器是否全屏(浏览器是否与屏幕等宽)
发布时间:2022-04-20 11:29:54
作者:泸州科技
来源:本站
浏览量(495)
摘要:应用场景:根据浏览器是否占满屏幕,来执行一些事情。如果占满屏幕,则显示动画,否则显示文字。第一步:如下通过JQ实现第二步:逻辑根据浏览器的宽度window.outerWidth;与屏幕的宽度windows.screen.width对比。如果相等则是全屏,否则不是全屏。第三步:通过监听窗口的大小变化事件。去调用。第四步:在DOM页面加载完的时候
应用场景:根据浏览器是否占满屏幕,来执行一些事情。如果占满屏幕,则显示动画,否则显示文字。
第一步:如下通过JQ实现
第二步:逻辑根据浏览器的宽度window.outerWidth;与屏幕的宽度windows.screen.width对比。如果相等则是全屏,否则不是全屏。
第三步:通过监听窗口的大小变化事件。去调用。
第四步:在DOM页面加载完的时候,也要去调用,否则刷新的时候,没有变化。
$(function(){
// 加载的完的时候调用判断是否有改变
isFullScreen()
// 监听浏览器尺寸变化
$(window).resize(function(){
isFullScreen()
})
})
// 判断浏览器是否改变函数
function isFullScreen(){
var broswerWidth = window.outerWidth;
var screenWidth = window.screen.width;
if(broswerWidth==screenWidth){
$(".taglineP").show();
$(".tagline").hide();
}else{
$(".tagline").show();
$(".taglineP").hide()
}
}
252