$('.logo').removeClass('logo').addClass('logo-scroll');
761 ve 761'den büyük ise
$('.logo-scroll').removeClass('logo-scroll').addClass('logo');
çalışsın istiyorum. Bunu nasıl yapabilirim ?
JS ile ekran genişliğine göre Class değiştirmek |
8 Mesajlar | 2.520 Okunma | ||
- Üyelik 02.01.2014
- Yaş/Cinsiyet 34 / E
- Meslek Wordpress, CSS Dev.
- Konum Ankara
- Ad Soyad Y** S**
- Mesajlar 96
- Beğeniler 19 / 7
- Ticaret 0, (%0)
Ekran genişliği 760 ve 760 dan küçük ise
761 ve 761'den büyük ise
çalışsın istiyorum. Bunu nasıl yapabilirim ?
761 ve 761'den büyük ise
çalışsın istiyorum. Bunu nasıl yapabilirim ?
J4cob.net
- Üyelik 03.10.2013
- Yaş/Cinsiyet 44 / E
- Meslek Yazılım Uzmanı, Matematikçi
- Konum Ankara
- Ad Soyad S** T**
- Mesajlar 1118
- Beğeniler 325 / 324
- Ticaret 2, (%100)
if (jQuery(document).outerWidth(false) < 761)
{
bişeyler
}
else
{
başka bişeyler.
}
{
bişeyler
}
else
{
başka bişeyler.
}
www.ontedi.com
www.cizgi.site
www.cizgi.site
- Üyelik 26.12.2015
- Yaş/Cinsiyet 31 / E
- Meslek Grafik Tasarım
- Konum İstanbul Avrupa
- Ad Soyad K** T**
- Mesajlar 78
- Beğeniler 30 / 29
- Ticaret 0, (%0)
CSS @media ları kullanabilirsin.
Örneğin:
.logo-scroll {overflow:none;}
@media screen and (max-width: 720px) {
.logo-scroll {overflow:auto;}
}
Yukarıda ki kodda genişlik 720 den küçük olunca scroll çıkaracak.
Örneğin:
.logo-scroll {overflow:none;}
@media screen and (max-width: 720px) {
.logo-scroll {overflow:auto;}
}
Yukarıda ki kodda genişlik 720 den küçük olunca scroll çıkaracak.
- Üyelik 04.10.2014
- Yaş/Cinsiyet 32 / E
- Meslek Tasarımcı
- Konum Ankara
- Ad Soyad M** A**
- Mesajlar 791
- Beğeniler 96 / 374
- Ticaret 1, (%100)
Örnek: http://jsfiddle.net/5SM9u/
- Üyelik 02.01.2014
- Yaş/Cinsiyet 34 / E
- Meslek Wordpress, CSS Dev.
- Konum Ankara
- Ad Soyad Y** S**
- Mesajlar 96
- Beğeniler 19 / 7
- Ticaret 0, (%0)
teşekkürler genişliği değiştirdiğimde class değişiyor ama Ekran 760'dan küçük load olduğunda class değişmiyor.Bunu nasıl çözerim ?
J4cob.net
- Üyelik 03.10.2013
- Yaş/Cinsiyet 44 / E
- Meslek Yazılım Uzmanı, Matematikçi
- Konum Ankara
- Ad Soyad S** T**
- Mesajlar 1118
- Beğeniler 325 / 324
- Ticaret 2, (%100)
window.resize konusunu araştırırsanız istediğiniz olacaktır. Ekran yeniden boyutlandırıldığında yani.
Ama media etiketleri ile css'te işinizi daha hızlı ve basit halledebilirsiniz.
Ama media etiketleri ile css'te işinizi daha hızlı ve basit halledebilirsiniz.
www.ontedi.com
www.cizgi.site
www.cizgi.site
- Üyelik 23.11.2011
- Yaş/Cinsiyet 31 / E
- Meslek öğrenci
- Konum İzmir
- Ad Soyad Ö** G**
- Mesajlar 1647
- Beğeniler 347 / 570
- Ticaret 8, (%100)
teşekkürler genişliği değiştirdiğimde class değişiyor ama Ekran 760'dan küçük load olduğunda class değişmiyor.Bunu nasıl çözerim ?
TEHET adlı arkadaşın koduna ek olarak, şöyle olması lazım.
function checkWidth() {
if ($(window).width() < 514) {
$('#menu2').addClass('f-nav');
} else {
$('#menu2').removeClass('f-nav');
}
}
checkWidth()
$(window).resize(checkWidth);
checkWidth() i sayfa yüklendiğinde de çağırmanız gerek.
ozergul.net/com
- Üyelik 02.01.2014
- Yaş/Cinsiyet 34 / E
- Meslek Wordpress, CSS Dev.
- Konum Ankara
- Ad Soyad Y** S**
- Mesajlar 96
- Beğeniler 19 / 7
- Ticaret 0, (%0)
TEHET adlı arkadaşın koduna ek olarak, şöyle olması lazım.
checkWidth() i sayfa yüklendiğinde de çağırmanız gerek.
function checkWidth() {
if ($(window).width() < 514) {
$('#menu2').addClass('f-nav');
} else {
$('#menu2').removeClass('f-nav');
}
}
checkWidth()
$(window).resize(checkWidth);
checkWidth() i sayfa yüklendiğinde de çağırmanız gerek.
aynen checkWidth() i sayfa yüklendiğinde çağırmadığım için genişliği değiştirmeden çalışmıyordu.Teşekkürler :)
J4cob.net
Konuyu toplam 1 kişi okuyor. (0 kullanıcı ve 1 misafir)