Css 调整卷轴上的徽标大小

您好，我有一个脚本，它可以很好地调整一个徽标的大小，然后再向下和向后滚动，但我不希望它在屏幕大小小于600px时这样做。我如何更改以实现这一点？非常感谢您的帮助

// When the user scrolls down 50px from the top of the document, resize the header's font size
window.onscroll = function() {scrollFunction()};

function scrollFunction() {
  if (document.body.scrollTop > 50 || document.documentElement.scrollTop > 50) {
    document.getElementById("header-logo").style.width = "180px";
 } 
   else {
   document.getElementById("header-logo").style.width = "215px";
 }

---

}

你可以这样做

if (screen.width > 600px){
    //your code
}

---

您可以使用

媒体查询

来实现此目的

@media (max-width: 600px) {
  #header-logo {
    width: 180px !important;//!important use to override inner html styles 
  }
}

---

幸运的是，使用了一些DoomBots代码，它就可以使用下面的代码了 //当用户从文档顶部向下滚动50px时，调整标题的字体大小 window.onscroll=function（）{scrollFunction（）}

函数滚动函数（）{
如果（document.body.scrollTop>50 | | document.documentElement.scrollTop>50 | |
屏幕宽度<600）{
document.getElementById（“标题徽标”）.style.width=“180px”；
} 
否则{
如果（屏幕宽度>600）{
document.getElementById（“标题徽标”）.style.width=“215px”；
}
}

---

}

如果（screen.width>600px）{window.onscroll=function（）{scrollFunction（）}；function scrollFunction（）{if（document.body.scrollTop>50 | | | | document.documentElement.scrollTop>50）{document.getElementById（“标题徽标”）.style.width=“180px”}否则{document.getElementById（“标题徽标”）.style.width=“215px”}}}}尝试不使用px，并在屏幕前添加

窗口
。所以
window.screen.width>600
另外，我认为您需要考虑滚动条，您可以使用window.screen.availwidth是的，但当窗口被卷回时，它会返回到215pxIn桌面或移动。。。。如果出现这种情况，请尝试使用js在scroll上添加类，然后设置样式。。那肯定能做到
function scrollFunction() {
  if (document.body.scrollTop > 50 || document.documentElement.scrollTop > 50 || 
screen.width < 600) {
    document.getElementById("header-logo").style.width = "180px";
  } 
    else {
       if (screen.width > 600){
       document.getElementById("header-logo").style.width = "215px";
 }
 }