Kullanıcı:
Filtreler

jquery click css hakkında

memurvadisi1
memurvadisi1

memurvadisi1

Kayıtlı Üye
Katılım
12 Nisan 2014
Mesajlar
3.024
Tepkime puanı
0
Puan
0
PHP: 
<script type="text/javascript">
$(function(){
	$("#menu").click(function(){
		$('.menu ul').toggle();
		$("#menu").css("background", "url(images/menu2.png)"); 
		});
});
</script>


cssde #menu divinin bgsi menu.png, ben click 1 kere bastığımda menu2.png oluyor buraya kadar sıkıntı yok tekrar bastığımda menu.png olmasını istiyorum yardımcı olabilecek varmı.
araştırmalarım aşağıdaki tarzda birşeyle çözülebileceğini söylüyor ama tam oturtamadım.

PHP: 
<script type="text/javascript">
$(function(){
	$("#menu").click(function(){
		$('.menu ul').toggle();
		$("#menu").css("background", "url(images/menu2.png)"); }, function (){
		$("#menu").css("background", "url(images/menu.png)");
		});
});
</script>
 
bu şekilde yapabilirsin ama çok yanlış bir yöntem bence.

PHP: 
<script type="text/javascript"> 
$(function(){ 
    $("#menu").click(function(){ 
        $('.menu ul').toggle(); 
      
        $("#menu").css("background-image", function(i, val) {
            if (val.indexOf("images/menu2.png") > -1)  {
              return 'url(images/menu.png)';
            }
          
            return 'url(images/menu2.png)';
        });  
    }); 
}); 
</script>

doğru olan bu işi css ile yapmak. js ile sadece css class'ını ekleyip çıkartacaksınız. örneğin:

css;
Kod: 
#menu {
  background: red;
}

#menu.is-active {
  background: blue;
}

js;
PHP: 
<script type="text/javascript"> 
$(function(){ 
    $("#menu").click(function(){ 
        $('.menu ul').toggle(); 
      
        $(this).toggleClass('is-active');
    }); 
}); 
</script>

bu şekilde butona tıklandıkca arkaplanı sıra sıra kırmızı ve mavi olacak.
 
jebi' Alıntı:
bu şekilde yapabilirsin ama çok yanlış bir yöntem bence.

PHP: 
<script type="text/javascript"> 
$(function(){ 
    $("#menu").click(function(){ 
        $('.menu ul').toggle(); 
      
        $("#menu").css("background-image", function(i, val) {
            if (val.indexOf("images/menu2.png") > -1)  {
              return 'url(images/menu.png)';
            }
          
            return 'url(images/menu2.png)';
        });  
    }); 
}); 
</script>

doğru olan bu işi css ile yapmak. js ile sadece css class'ını ekleyip çıkartacaksınız. örneğin:

css;
Kod: 
#menu {
  background: red;
}

#menu.is-active {
  background: blue;
}

js;
PHP: 
<script type="text/javascript"> 
$(function(){ 
    $("#menu").click(function(){ 
        $('.menu ul').toggle(); 
      
        $(this).toggleClass('is-active');
    }); 
}); 
</script>

bu şekilde butona tıklandıkca arkaplanı sıra sıra kırmızı ve mavi olacak.
Genişletmek için tıkla ...


eyvallah hocam çok sağolun js bilgim çok kötü olduğundan ne tip bir yol izlemem gerektiğini bilmiyorum gogıl yönlendiriyor saçma sapan yerlere :D
 
Cevap yazmak için giriş yap yada kayıt ol.
Kişiselleştirme

Tema editörü

Ayarlar Renkler

  • Mobil kullanıcılar bu fonksiyonları kullanamaz.

    Alternatif header

    Farklı bir görünüm için alternatif header yapısını kolayca seçebilirsiniz.

    Görünüm Modu Seçimi

    Tam ekran ve dar ekran modları arasında geçiş yapın.

    Izgara Görünümü

    Izgara modu ile içerikleri kolayca inceleyin ve düzenli bir görünüm elde edin.

    Resimli Izgara Modu

    Arka plan görselleriyle içeriğinizi düzenli ve görsel olarak zengin bir şekilde görüntüleyin.

    Yan Paneli Kapat

    Yan paneli gizleyerek daha geniş bir çalışma alanı oluşturun.

    Sabit Yan Panel

    Yan paneli sabitleyerek sürekli erişim sağlayın ve içeriğinizi kolayca yönetin.

    Box görünüm

    Temanızın yanlarına box tarzı bir çerçeve ekleyebilir veya mevcut çerçeveyi kaldırabilirsiniz. 1300px üstü çözünürler için geçerlidir.

    Köşe Yuvarlama Kontrolü

    Köşe yuvarlama efektini açıp kapatarak görünümü dilediğiniz gibi özelleştirin.

  • Renginizi seçin

    Tarzınızı yansıtan rengi belirleyin ve estetik uyumu sağlayın.
Geri