JQuery ile Sayfayı Ekrana Sığdırmak

Merhaba, front-end çalışırken karşılaşılan problemlerden biri de sayfanın kendisinin ya da herhangi bir html elemanının, sayfanın uzunluğu, genişliği ya da her ikisi kadar büyükte olmasını sağlamaktır. bunu CSS ile çözebilirsiniz elementlere 100% vererek ya da diğer bir kaç uzunluk birimi ile çalışarak sağlayabilirsiniz ama bazen öyle durumlar oluyor ki istediğiniz sonuca bir türlü ulaşamayabiliyorsunuz bu durumda imdadımıza javascript yetişiyor. aşağıdaki fonksiyonu inceleyin

$(document).ready(function(){
resizeDiv();
});

window.onresize = function(event) {
resizeDiv();
}

function resizeDiv() {
vpw = $(window).width();
vph = $(window).height();
$("#ornekdiv").css({"height": vph + "px"});
}

Yukarıda sayfa yüklendiğinde ve window.onresize ile sayfanın yüksekliği veya genişliği değiştirildiğinde resizeDiv() fonksiyonu çağırılarak istenen elementin eni ve boyu ekranınkine eşitleniyor. Bu işlemin en sağlıklı şekli tabii ki CSS ile yapılmış olanıdır tercih edilmesi gereken de odur ama yukarıda bahsettiğim gibi bazı özel durumlarda problemi javascript ile çözmek de mantıklı olabilir. Herkese kolay gelsin.

Mustafa Tayyip YETİŞ
Yazılım Geliştirme Uzmanı

0.0 Ort. (0% puan) - 0 oy

Bir Cevap Yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir