MJQ - Ориентация никогда не изменяет высоту div - PullRequest
Новая
       3

MJQ - Ориентация никогда не изменяет высоту div

0 голосов
/ 22 февраля 2012

мне нужно изменить высоту div 'content', для этого я использовал этот код, но он никогда не работает ... любая идея, пожалуйста? 

$(window).bind('orientationchange', function() { 
    var screenWidth = $(window).width();
    if(screenWidth >= 768){
        var the_height = ($(window).height() - $(this).find('[data-role="header"]').height() - $(this).find('[data-role="footer"]').height());
        $(this).height($(window).height()).find('[data-role="content"]').height(the_height);
    }
});

особенно я использую это для ipadи таблетки.

1 Ответ

0 голосов
/ 22 февраля 2012

если событие directionalchange связывается должным образом, то это похоже на работу ... проверьте, разместив предупреждающие сообщения внутри привязки ... я сделал небольшой пример для изменения высоты с помощью события щелчка (http://jsfiddle.net/reddyprasad321/zj9LV/) 

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0.1/jquery.mobile-1.0.1.min.css" />
<script src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
<script src="http://code.jquery.com/mobile/1.0.1/jquery.mobile-1.0.1.min.js"></script>
<div data-role="page" id="page">
    <div data-role="content" id="contentDiv">
    This is Content Div ....  
    </div>
    </div>
</div>

и js: 

$('#contentDiv').click(function(){
    $('#contentDiv').height( $('#contentDiv').height()+20);
});

и CSS, чтобы увидеть разницу: 

#contentDiv{
    height:20px;
border-width: 5px;
border-spacing: 10px;
border-spacing: 10px;
border-image: initial;
border-color: red;   
line-height: 34px;
border-left: solid 1px #95C864;
border-right: solid 1px #74AE3B;
border-left: solid 1px rgba(255, 255, 255, 0.3);
border-right: solid 1px rgba(0, 0, 0, 0.1);
background:green;
}

, а также проверьте здесь для установки высоты http://api.jquery.com/height/

...