在 blogger 中使用 Javascript 和 if/else 语句隐藏某些元素

Question

我在 blogger 上有一个博客，我想使用 JS 来根据我在 if/else 语句中使用的特定条件来隐藏项目和显示其他项目。这是代码

<div id="Left-Ads-Sticky-1024-768" style="left: 0px; top: 0px; position: absolute;">
    Left-Ads-Sticky-1024-768
  </div>
  <div id="Left-Ads-Sticky-1280-800" style="left: 0px; top: 0px; position: absolute;">
    Left-Ads-Sticky-1280-800
  </div>
  <div id="Left-Ads-Sticky-1366-768" style="left: 0px; top: 0px; position: absolute;">
    Left-Ads-Sticky-1366-768
  </div>
  <script language="JavaScript">
    var W=screen.width; var H=screen.hieght;
    if (W==1366) &amp;&amp; (H==768))
    {
        document.getElementById("Left-Ads-Sticky-1024-768").style.visibility = "hidden";
        document.getElementById("Left-Ads-Sticky-1280-800").style.visibility = "hidden";
    }
    else 
    { 
        document.getElementById("Left-Ads-Sticky-1366-768").style.display = "inline";
    } 
  </script>

请帮我完成它。谢谢

Answer 1

将其复制并粘贴到您的浏览器中。它会检测您的分辨率并根据 max-width: 300px 是真还是假发出警报。（如果，否则）

$(document).ready(function(){
var mq = window.matchMedia('all and (max-width: 300px)');
if(mq.matches) {
    alert("the width of browser is more then 300px");
} else {
    alert("the width of browser is less then 300px");
}
});

您可以将自己的代码粘贴到警报所在的位置，就像这样

$(document).ready(function(){
var mq = window.matchMedia('all and (max-width: 1366px)'); // Your desired max resolution goes here. (you can change this to min-width)
if(mq.matches) {
    document.getElementById("Left-Ads-Sticky-1024-768").style.visibility = "hidden";
    document.getElementById("Left-Ads-Sticky-1280-800").style.visibility = "hidden";
} else {
    document.getElementById("Left-Ads-Sticky-1366-768").style.display = "inline";
}
});

更新：缩小版本

$(document).ready(function(){var e=window.matchMedia("all and (max-width: 1366px)");e.matches?(document.getElementById("Left-Ads-Sticky-1024-768").style.visibility="hidden",document.getElementById("Left-Ads-Sticky-1280-800").style.visibility="hidden"):document.getElementById("Left-Ads-Sticky-1366-768").style.display="inline"});

在 blogger 中使用 Javascript 和 if/else 语句隐藏某些元素

Use Javascript and if/else statements in blogger to hide certain elements

html

javascript

css

blogger