js判斷瀏覽器是否全屏(瀏覽器是否與屏幕等寬)
發布時間:2022-04-20 11:29:54
作者:瀘州科技
來源:本站
瀏覽量(465)
摘要:應用場景:根據瀏覽器是否占滿屏幕,來執行一些事情。如果占滿屏幕,則顯示動畫,否則顯示文字。第一步:如下通過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()
}
}
203