请教如何使一个div先隐藏不显示， 只有当页面高度缩小到某值以下时才显示出来？

[Z.Chen]

请教如何使一个div先隐藏不显示， 只有当页面高度缩小到某值（例如height小于300px）以下才显示出来？
JS JQ CSS Bootstrap 均可。
谢谢！

[jio可]

高度变小是手动改变大小还是dom没有内容变小？ 前者直接监听 window.onresize = function(){ if (window.innerHeight < 300) { // 设置dom显示 } } 后者判断dom当前高度

[_念_]

媒体查询 也可以

[潇湘忆梦]

$(function(){ 
     if(document.body.scrollHeight<300){
          $(".XXX").show();
     }
});

[Z.Chen]

引用 3 楼 潇湘忆梦 的回复:

$(function(){ 
     if(document.body.scrollHeight<300){
          $(".XXX").show();
     }
});

很奇怪。。按着这个写法当我刚开始（全屏）时是显示的，我慢慢缩小高度到300以下div就消失了，跟我需要的正好相反。。。 改成 >300 $(".XXX").hide(); 也不行。。。

[Z.Chen]

引用 1 楼 jio可 的回复:

高度变小是手动改变大小还是dom没有内容变小？ 前者直接监听 window.onresize = function(){ if (window.innerHeight < 300) { // 设置dom显示 } } 后者判断dom当前高度

是手动改变大小DIV 按着这个写法当我刚开始（全屏）时DIV就是显示的，我慢慢缩小高度到300以下div就消失了，跟我需要的正好相反。。。 而我改成： window.onresize = function(){ if (window.innerHeight > 300) { $(".substudy").hide(); } } 时，刚开始全屏时div是隐藏了，但我慢慢缩小到300以下时也没有显示出来。。

[Z.Chen]

引用 1 楼 jio可 的回复:

高度变小是手动改变大小还是dom没有内容变小？ 前者直接监听 window.onresize = function(){ if (window.innerHeight < 300) { // 设置dom显示 } } 后者判断dom当前高度

是我自己傻B了，有个小错误~~ 用您的方法解决了，加了个else， 感谢大神~~