Блог

Главная - Вопросы по программированию - Пробел в пространстве мобильной сетки jQuery

Пробел в пространстве мобильной сетки jQuery

#jquery-mobile #grid #height #space #gaps-in-visuals

#jquery-мобильный #сетка #высота #Космос #пробелы в визуальных эффектах

Вопрос:

Я использую сетки мобильной компоновки jQuery с 2 столбцами, но при разной высоте ячейки возникает пробел.

Пример:

 <!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title>jQueryMobile Demos</title>                         
        <link type="text/css" rel="stylesheet" href="jquery.mobile-1.0a4.min.css" />
        <script type="text/javascript" src="jquery-1.5.2.min.js"></script>
        <script type="text/javascript" src="jquery.mobile-1.0a4.min.js"></script>            
    </head>
    <body>        
        <div data-role="page">
            <div data-role="content">
                <div class="ui-grid-a">
                    <div class="ui-block-a"><div class="ui-bar ui-bar-c">Name</div></div>
                    <div class="ui-block-b"><div class="ui-bar ui-bar-c">Diogo<br />Cardoso</div></div>             
                </div>
            </div>
        </div>  
    </body>

Ответ №1:

В документации (в примере) для высоты используется тег в стиле inline. Документация: http://jquerymobile.com/demos/1.0a4.1/docs/content/content-grids.html

тег в встроенном стиле: style="height:120px"

Вот рабочий пример:http://jsfiddle.net/V4uqN/5 /

http://api.jquery.com/css/

Что-то вроде:

 $('#element').css('height','120px');

Комментарии:

1. Но в моем случае высота ячеек может измениться.

2. вы всегда можете манипулировать этим с помощью .css() в jQuery, см. Пример

3. Другим подходом было бы наложить div на блоки пользовательского интерфейса и переопределить стили границ.