Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 11.02.2012, 21:02
Новичок на форуме
Отправить личное сообщение для tempofnick Посмотреть профиль Найти все сообщения от tempofnick
 
Регистрация: 11.02.2012
Сообщений: 2

Как организовать скрытие блока при уменьшении окна?
Пример - 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>
Ответить с цитированием
  #2 (permalink)  
Старый 11.02.2012, 23:32
Новичок на форуме
Отправить личное сообщение для tempofnick Посмотреть профиль Найти все сообщения от tempofnick
 
Регистрация: 11.02.2012
Сообщений: 2

Решил проблему сам


<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>
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Два блока div разъезжаются при скроллинге окна браузера. call007 jQuery 0 03.04.2011 16:21
Как сделать, чтобы при наведении на кнопку справа от нее появлялись текстовые ссылки? Tass Общие вопросы Javascript 7 17.02.2011 09:06
Скрытие блока div и его составляющих pomuk123 Events/DOM/Window 6 14.02.2011 10:31
Как организовать RichEdit arma Элементы интерфейса 2 18.02.2010 14:57
Скрытие блока после потери фокуса Nubi jQuery 2 06.02.2009 22:58