Tüm Araçlar
  • Tema Seçeneği
  • Site Sesleri
  • Bildirimler
  • Özel Mesaj Al
lostyazilim
tr.link

Css de menu yaparken aktif sayfa nasıl yapılır. ?

 4 Mesajlar 7.917 Okunma
lstbozum
tr.link

#1
olkunmustafa olkunmustafa WM Aracı Kullanıcı
  • Üyelik 18.04.2012
  • Yaş/Cinsiyet 37 / E
  • Meslek Web & Android Developer
  • Konum
  • Ad Soyad M** O**
  • Mesajlar 423
  • Beğeniler 60 / 44
  • Ticaret 0, (%0)
Arkadaşlar dün gece üzerinde çalışıp çözemediğim bir sorunum var. Menu yapımına aktif menu hangi kodla belirleniyor acaba. Yani örnek vererek söyleyeyim.


  • Elma

  • Armut

  • mandalina

  • Muz

  • Kivi



      • Şimdi yukarıdaki menu de atıyorum ben Armut sayfasını tıkladım şu anda o sayfadayım yani. Menude aktif kodu hangisi acaba??

      a:focus {} kodunu denedim işe yaramadı. Normalde Wordpress sitelerimde current_page_item kullanıyorum ama oda işe yaramadı nedense.

      Css olur, jquery olur bunun çözümü nedir arkadaşlar. Şimdiden teşekkürler...
 

 

wmaraci
reklam

#2
kilitbilgi kilitbilgi kilitbilgi@gmail.com Kullanıcı
  • Üyelik 13.06.2012
  • Yaş/Cinsiyet 31 / E
  • Meslek Bilgisayar Mühendisi
  • Konum İzmir
  • Ad Soyad B** Ç**
  • Mesajlar 396
  • Beğeniler 82 / 125
  • Ticaret 3, (%100)
Menünüzde hover seçicisini kullanırken bir de .simdiki gibi bir class ekleyin.
Tıkladığınız sayfada tıklanılan sayfaya dek gelen linke .simdiki class'ını ekleyin.
Örneğin:
Elma sayfasında kodunuz şu şekilde olsun.



Armut sayfasında ise


 

 

#3
olkunmustafa olkunmustafa WM Aracı Kullanıcı
  • Üyelik 18.04.2012
  • Yaş/Cinsiyet 37 / E
  • Meslek Web & Android Developer
  • Konum
  • Ad Soyad M** O**
  • Mesajlar 423
  • Beğeniler 60 / 44
  • Ticaret 0, (%0)

kilitbilgi adlı üyeden alıntı

Menünüzde hover seçicisini kullanırken bir de .simdiki gibi bir class ekleyin.
Tıkladığınız sayfada tıklanılan sayfaya dek gelen linke .simdiki class'ını ekleyin.
Örneğin:
Elma sayfasında kodunuz şu şekilde olsun.



Armut sayfasında ise




Tıklandığı zaman class atama işlemini jquery ile çözücez yanlış anlamadıysam ??
 

 

#4
kilitbilgi kilitbilgi kilitbilgi@gmail.com Kullanıcı
  • Üyelik 13.06.2012
  • Yaş/Cinsiyet 31 / E
  • Meslek Bilgisayar Mühendisi
  • Konum İzmir
  • Ad Soyad B** Ç**
  • Mesajlar 396
  • Beğeniler 82 / 125
  • Ticaret 3, (%100)
Javascript Kodu
<script>
$(function(){
$sayfa = jQuery.url.attr("file");
if(!$sayfa) {
$sayfa = 'armut';
}
$('#li a').each(function(){
var $href = $(this).attr('href');
if ( ($href == $sayfa) || ($href == '') ) {
$(this).addClass('simdiki');
} else {
$(this).removeClass('simdiki');
}
});
});
</script>

Css Kodu


Burada önce armut sayfasında isek li elementlerinden armut sekmesinin rengi siyah oldu , başka bir linke tıklanırsa
tıklanılan sekmenin rengi siyah olacaktır.
 

 

wmaraci
wmaraci
position:absolute; kodu fixed kodunun önüne geçiyor
Arayüz geliştiriciler için 10 online CSS3 aracı
wmaraci
wmaraci
Konuyu toplam 1 kişi okuyor. (0 kullanıcı ve 1 misafir)
 
Site Ayarları
  • Tema Seçeneği
  • Site Sesleri
  • Bildirimler
  • Özel Mesaj Al