Bagaimanakah Saya Boleh Mengira Ketinggian Kandungan dengan Tepat dalam jQuery Mobile untuk Mengisi Ruang Antara Pengepala dan Pengaki?

Meningkatkan Pengiraan Ketinggian Kandungan untuk Halaman Web dengan jQuery Mobile

Untuk mengisi ruang antara pengepala dan pengaki dengan berkesan dalam halaman web jQuery Mobile , pengiraan tepat ketinggian kandungan adalah penting. Untuk mencapai matlamat ini, adalah perlu untuk mempertimbangkan kesan bar alat tetap, yang mungkin meninggalkan sedikit jurang.

Penyelesaian untuk jQuery Mobile >= 1.3

var screen = $.mobile.getScreenHeight();

var header = $(".ui-header").hasClass("ui-header-fixed") ? $(".ui-header").outerHeight()  - 1 : $(".ui-header").outerHeight();

var footer = $(".ui-footer").hasClass("ui-footer-fixed") ? $(".ui-footer").outerHeight() - 1 : $(".ui-footer").outerHeight();

/* content div has padding of 1em = 16px (32px top+bottom). This step
   can be skipped by subtracting 32px from content var directly. */
var contentCurrent = $(".ui-content").outerHeight() - $(".ui-content").height();

var content = screen - header - footer - contentCurrent;

$(".ui-content").height(content);

Penyelesaian untuk jQuery Mobile <= 1.2

Memandangkan bar alat tetap dalam versi 1.2 dan ke bawah tidak memperkenalkan margin 1px, pengiraan dipermudahkan:

var header = $(".ui-header").outerHeight();

var footer = $(".ui-footer").outerHeight();

Resolusi Penuh

Untuk mengambil kira padding di sekeliling div kandungan, sama ada laraskan pembolehubah kandungan secara terus atau tolak nilai padding (32px) daripada contentCurrent variable. Selain itu, jika bar alat tetap ada, keluarkan 1px daripada ukuran outerHeight()nya.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Mengira Ketinggian Kandungan dengan Tepat dalam jQuery Mobile untuk Mengisi Ruang Antara Pengepala dan Pengaki?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!