Как организовать скрытие блока при уменьшении окна?
Пример - google. ru/nwshp?ned=ru
<style type="text/css"> html, body {height: 100%;} .wrap { width:100%; min-width:1000px; min-height:100%; margin:0; padding:0; overflow-x:hidden; } .outer { margin:0 200px 0 200px; zoom:1; } .outer:after { content:''; clear:both; display:block; overflow:hidden; height:0; } .boxCL { float:left; width:100%; zoom:1; } .centerCol { float:right; width:100%; zoom:1; } .leftCol { background:#FFFFCC; float:left; width:160px; padding:20px; position:relative; margin-left:-200px; zoom:1; } .rightCol { background:#CCFFFF; float:right; width:160px; padding:20px; position:relative; margin-right:-200px; zoom:1; } </style> <body> <div class="wrap"> <div class="outer"> <div class="boxCL"> <div class="centerCol">меню</div> <div class="leftCol">контент</div> </div> <div class="rightCol">скрыть если окно меньше 900px</div> </div> </div> </body> |
Решил проблему сам
<script type="text/javascript"> var width, height; var IE=(navigator.userAgent.indexOf('MSIE')!=-1) function resizeElement() { if(window.innerWidth) width=window.innerWidth; else if((document.body)&&(document.body.clientWidth)) width=document.body.clientWidth; if(window.innerHeight) height=window.innerHeight; else if((document.body)&&(document.body.clientHeight)) height=document.body.clientHeight; if(IE) { if(document.documentElement&&document.documentElement.clientHeight&&document.documentElement.clientWidth) { width=document.documentElement.clientWidth; height=document.documentElement.clientHeight; } } var element=document.getElementById('rightCol'); var elementw=document.getElementById('outer'); width=(width>900)?"block":"none"; widthz=(width=="block")?"0 200px 0 200px":"0 0 0 200px"; element.style.display=width; elementw.style.margin=widthz; } window.onload=resizeElement; </script> </head><body onresize="resizeElement()"> <div class="wrap"> <div id="outer" class="outer"> <div class="boxCL"> <div class="centerCol">меню</div> <div class="leftCol">контент</div> </div> <div id="rightCol" class="rightCol">скрыть если окно меньше 900px</div> </div> </div> </body></html> |
Часовой пояс GMT +3, время: 12:37. |