Frage

Wie kann ich die Größe des div maximieren, die die Rolle der „Inhalt“ spielt?

Ich erkennen, dass dies einfach eine grundlegende CSS Frage sein kann, aber es fühlt mich an wie es zu CSS in jQueryMobile gebunden ist.

Ich bin ein Google Map in dem Inhalt div platzieren und ich würde die Karte wie die zur Verfügung stehende verticle Speicherplatz auf dem mobilen Browser zu füllen. Stattdessen ist es eine feste Größe von etwa 10px (mehr oder weniger).

<div data-role="page">
 <div data-role="header" class="ui-header ui-bar-a">Header</div>
 <div data-role="content" class="ui-body ui-content">
  <div id="divMap">google map via javascript</div>
 </div>
 <div data-role="footer">footer</div>

In diesem Fall jQueryMobile schafft immer die minimale Größe für seinen Inhalt, und ich will es immer 80% der verfügbaren Seite sein.

War es hilfreich?

Lösung

Sie könnten wahrscheinlich verwenden jQuery (ich habe nicht mit jQuery Mobile gearbeitet, obwohl, so dass diese nicht direkt funktionieren können):

$(document).ready(
  function(){
    $('#content').height($(window).height()*0.8);
  }
);

JS Fiddle Demo

Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top