根据窗口大小切换功能答案

【问题标题】：Toggle function conditional on window size根据窗口大小切换功能
【发布时间】：2015-01-08 22:09:55
【问题描述】：

我正在尝试创建一个函数，如果窗口大小小于 768 像素，那么我想使用链接切换给定 div 的显示。

如果窗口大小大于 768，我希望显示器重置为阻塞。

if($(window).width() < 768){
    function toggle_visibility(id) {
    var e = document.getElementById(id);


       if( e.style.display == 'block' )
          e.style.display = 'none';
       else
          e.style.display = 'block';
    }

}
else{
        e.style.display = 'block';
    }

HTML

<a href="#" onclick="toggle_visibility('sidebar');"><i class="fa fa-bars"></i></a>

【问题讨论】：

$('#el_id').toggle( $(window).width() < 768 )
我想要它，所以如果宽度大于 768，那么无论如何 display = block。宽度是否小于768，可以切换。
@adeneo 评论也是如此，我希望可以像他的评论一样加倍检查我的答案。

标签： jquery

【解决方案1】：

您声明该函数不在任何地方调用它

此外，您可以使用 jquery 并使其变得简单，例如：

 function toggle_visibility(id) {
  if($(window).width() < 768){
      $("#"+id).toggle();

  }
   else{
        $("#"+id).hide()
    }     

    }

【讨论】：

查看包含的html
这可行，但是当我关闭 div 并再次使窗口变大时，div 不存在。我正在努力做到这一点，如果窗口大于 768，无论如何它就在那里。

【解决方案2】：

你在哪里调用函数？？

function toggle_visibility(id) {
var e = document.getElementById(id);


   if( e.style.display == 'block' )
      e.style.display = 'none';
   else
      e.style.display = 'block';
};
 if( $(document).width() < 768){
    toggle_visibiliti(your element id);
 }else{
   e.style.display = 'block';
  };

【讨论】：