Jquery Ders-37 resize() Kullanımı
UstaDerslik Soru-Cevap Yararlı Araçlar
arama ikon
Diller
Türkçe Türkçe

bilgi UstaDerslik
Bu uyari kutusudur.
Tamam
Anasayfa
İletişim
Üyeler

Jquery Ders-37 resize() Kullanımı

profil
cArleone
BEĞEN(1)
BEĞENME(0)
GÖRÜNTÜLENME(3201)
RAPOR ET
Jquery derslerimize devam ediyoruz.Bu derste resize() methodunu anlatacağım.Resize browser penceresinde değişen boyutları yakalar.Örneğin zoom yaptığımızda yada pencereyi küçültüp,büyültüğümüzde resize bu anı yakalar.Bu yakalamaya göre bizde işlemler yapabiliriz.Genellikle responsive sitelerde uyum için kullanılır.Kullanımı oldukça basitir.

İndir : http://ustaderslik.com/dosya/Jquery%20Ders-37%20resize()%20Kullanımı.zip

$(window).resize(function(){
//işlemler
})

Bu şekilde değişimi yakalıyoruz.Window yerine document ve body de yazabiliriz.

Genel örnek :
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>Ustaderslik</title>
<script type="text/javascript" src="jquery-1.9.1.js"></script>
<script type="text/javascript">
$(function(){

var w=$(window).width(),h=$(window).height();
$(".w").text(w)
$(".h").text(h)//ilk boyutlar

$(window).resize(function(){//boyut değişirse
var w=$(window).width(),h=$(window).height();
$(".w").text(w)
$(".h").text(h)//değiştikten sonraki boyutlar.
})

})
</script>
</head>
<body>

<div class="w"></div>
<div class="h"></div>

</body>
</html>


Yukarıdaki örnekte pencere boyutu her değiştiğinde yeni boyutlarını alıp ekrana bastım.Responsive sitelerinizde bu şekilde boyutları alıp sığdırma işlemi yapabiliriz.



Kod
Kalın
Vurgu
Resim
Video
Url
CEVAPLA
Tüm Hakları Saklıdır. ©Arleone 2013-2014 UstaDerslik






Giriş
Şifremi Unuttum...
Şifre Talep
  Kuralları Kabul Ediyorum.
Kaydol