Javascript window.resize和window.innerwidth高度问题?
一些Javascript/JQuery代码有点问题 我们使用的网站有两个菜单-一个用于桌面,一个用于移动。桌面菜单直接指向页面,但移动版为网站的某些部分添加了下拉子菜单功能(如果子菜单已展开,则使用addClass方法等) 通常情况下,这可以正常工作-但是,在Chrome中调整窗口高度似乎会导致代码不时被忽略。然而,再次玩弄高度可以让它再次发挥作用 这是一个问题,尤其是在Android上的Chrome等移动设备上使用该网站时——因为地址栏被隐藏会导致窗口高度调整——菜单功能停止工作。 但是,当地址栏在屏幕上时,它工作正常 它似乎是在随机的基础上这样做的,因为我找不到忽略代码时的高度断点 下面的代码应该进一步澄清这种情况Javascript window.resize和window.innerwidth高度问题?,javascript,jquery,height,window-resize,Javascript,Jquery,Height,Window Resize,一些Javascript/JQuery代码有点问题 我们使用的网站有两个菜单-一个用于桌面,一个用于移动。桌面菜单直接指向页面,但移动版为网站的某些部分添加了下拉子菜单功能(如果子菜单已展开,则使用addClass方法等) 通常情况下,这可以正常工作-但是,在Chrome中调整窗口高度似乎会导致代码不时被忽略。然而,再次玩弄高度可以让它再次发挥作用 这是一个问题,尤其是在Android上的Chrome等移动设备上使用该网站时——因为地址栏被隐藏会导致窗口高度调整——菜单功能停止工作。 但是,当地
$(document).ready(function() {
topnavigation(), window.innerWidth < 767 && ($("#services").click(function() {
$(this).hasClass("expanded") ? $(this).removeClass("expanded") : $(this).addClass("expanded"), event.preventDefault(), $(".subnav2").toggle()
}), $("#creative").click(function() {
return $(this).hasClass("expanded") ? $(this).removeClass("expanded") : $(this).addClass("expanded"), $("#creativenav").toggle(), !1
}), $("#marketing").click(function() {
return $(this).hasClass("expanded") ? $(this).removeClass("expanded") : $(this).addClass("expanded"), $("#marketingnav").toggle(), !1
}), $("#digital").click(function() {
return $(this).hasClass("expanded") ? $(this).removeClass("expanded") : $(this).addClass("expanded"), $("#digitalnav").toggle(), !1
}), $("#med-ed").click(function() {
return $(this).hasClass("expanded") ? $(this).removeClass("expanded") : $(this).addClass("expanded"), $("#med-ednav").toggle(), !1
})),
$(window).resize(function() {
var width = jQuery(window).width();
var height = jQuery(window).height();
console.log(window.innerWidth);
topnavigation(), window.innerWidth < 767 ? ($("#services").click(function() {
$(this).hasClass("expanded") ? $(this).removeClass("expanded") : $(this).addClass("expanded"), event.preventDefault(), $(".subnav2").toggle()
}),
$("#creative").click(function() {
return $(this).hasClass("expanded") ? $(this).removeClass("expanded") : $(this).addClass("expanded"), $("#creativenav").toggle(), !1
}),
$("#marketing").click(function() {
return $(this).hasClass("expanded") ? $(this).removeClass("expanded") : $(this).addClass("expanded"), $("#marketingnav").toggle(), !1
}),
$("#digital").click(function() {
return $(this).hasClass("expanded") ? $(this).removeClass("expanded") : $(this).addClass("expanded"), $("#digitalnav").toggle(), !1
}),
$("#med-ed").click(function() {
return $(this).hasClass("expanded") ? $(this).removeClass("expanded") : $(this).addClass("expanded"), $("#med-ednav").toggle(), !1
})) : $("#services").click(function() {
$(".subnav2").hide(), window.location = "#"
}),
window.innerWidth >= 768 && ($(".nav-collapse").removeClass("opened"), $(".nav-collapse").addClass("closed"), $(".nav-collapse").css("position", "absolute"), $(".nav-collapse").removeClass("expanded"), $(".nav-toggle").removeClass("active"), $(".subnav2").hide())
})
})
$(文档).ready(函数(){
topnavigation(),window.innerWidth<767&($(“#服务”)。单击(函数(){
$(this).hasClass(“扩展”)?$(this.removeClass(“扩展”):$(this.addClass(“扩展”),event.preventDefault(),$(.subnav2”).toggle()
}),$(“#创意”)。单击(函数(){
return$(this).hasClass(“expanded”)?$(this.removeClass(“expanded”):$(this.addClass(“expanded”),$(“#creativenav”).toggle(),!1
}),$(“#营销”)。单击(功能(){
返回$(this).hasClass(“扩展”)?$(this).removeClass(“扩展”):$(this).addClass(“扩展”),$(“#marketingnav”).toggle(),!1
}),$(“#数字”)。单击(函数(){
返回$(this).hasClass(“扩展”)?$(this).removeClass(“扩展”):$(this).addClass(“扩展”),$(“#digitalnav”).toggle(),!1
}),$(“#医学版”)。单击(函数(){
返回$(this).hasClass(“扩展”)?$(this).removeClass(“扩展”):$(this).addClass(“扩展”),$(“#med ednav”).toggle(),!1
})),
$(窗口)。调整大小(函数(){
var width=jQuery(window).width();
var height=jQuery(window).height();
console.log(window.innerWidth);
topnavigation(),window.innerWidth<767($(“#服务”)。单击(函数(){
$(this).hasClass(“扩展”)?$(this.removeClass(“扩展”):$(this.addClass(“扩展”),event.preventDefault(),$(.subnav2”).toggle()
}),
$(“#创意”)。单击(函数(){
return$(this).hasClass(“expanded”)?$(this.removeClass(“expanded”):$(this.addClass(“expanded”),$(“#creativenav”).toggle(),!1
}),
$(“#营销”)。单击(函数(){
返回$(this).hasClass(“扩展”)?$(this).removeClass(“扩展”):$(this).addClass(“扩展”),$(“#marketingnav”).toggle(),!1
}),
$(“#数字”)。单击(函数(){
返回$(this).hasClass(“扩展”)?$(this).removeClass(“扩展”):$(this).addClass(“扩展”),$(“#digitalnav”).toggle(),!1
}),
$(“#med ed”)。单击(函数(){
返回$(this).hasClass(“扩展”)?$(this).removeClass(“扩展”):$(this).addClass(“扩展”),$(“#med ednav”).toggle(),!1
})):$(“#服务”)。单击(功能(){
$(“.subnav2”).hide(),window.location=“#”
}),
window.innerWidth>=768&($(“.nav collapse”).removeClass(“打开”)、$(.nav collapse”).addClass(“关闭”)、$(.nav collapse”).css(“位置”、“绝对”)、$(.nav collapse”).removeClass(“扩展”)、$(.nav切换”).removeClass(“活动”)、$(.subnav2”).hide())
})
})
我要指出,topnavigation()不是这个问题的一个因素,因为这是针对粘性导航的,删除粘性导航功能仍然会导致这个基于高度的问题
是否还有其他原因导致这种情况发生