wmaraci reklam
lidertakipci

PHP İle Aşağı İndikçe Kayan Menü Yapımı

7 Mesajlar 2.062 Okunma
advertseo
wmaraci reklam

Webarazzi Webarazzi <?php print("Webarazzi"?> Kullanıcı
  • Üyelik 05.03.2016
  • Yaş/Cinsiyet 35 / E
  • Meslek Birtekno'loji Sahibi
  • Konum Çorum
  • Ad Soyad M** B**
  • Mesajlar 1068
  • Beğeniler 31 / 186
  • Ticaret 5, (%100)
Merhaba değerli webmaster dostlarım bugün ortalama birçok kod ile uğraştım ekleme silme vs vs derken en çok merak ettiklerimden birisi olan aşağı doğru indiğimde sitemde kayan menü mümkünmüdür die düşünürken birkaç makaleye rastlatım ve içinden birisini seçerek forum sitemde yayımladım ve buradada sizlerle paylaşmak istedim bilmiyorum bu tür bir konu forumda varmı ama işinize yarayacağını düşündüm ve paylaşmak istedim umarım işinize yarar neyse lafı uzatmadan başlayalım.



Öncelikle bu kodu tagından sonra ekleyiniz.

<script></script>

Daha sonra aşağıdaki kodu HTML tema wordpress yada script her neye kullanmak istiyorsanız oranın header yada indexine ekleyiniz.


Bu işlemi yaptıktan sonra aşağıdaki CSS kodlarını dediğim gibi HTML wordpress script ne için kullanıcaksanız CSS uzantısına ekleyin.

.nav-container{ background: url('images/nav_bg.jpg') repeat-x 0 0;}
.f-nav{ z-index: 9999; position: fixed; left: 0; top: 0; width: 100%;} /* this make our menu fixed top */

.nav { height: 42px;}
.nav ul { list-style: none; }
.nav ul li{float: left; margin-top: 6px; padding: 6px; border-right: 1px solid #ACACAC;}
.nav ul li:first-child{ padding-left: 0;}
.nav ul li a { }
.nav ul li a:hover{ text-decoration: underline;}


Ve son işlem olarak sistemin Javascriptini yine aynı şekilde tagından sonra ekleme yapıyorsunuz.

jQuery("document").ready(function($){

var nav = $('.nav-container');

$(window).scroll(function () {
if ($(this).scrollTop() > 136) {
nav.addClass("f-nav");
} else {
nav.removeClass("f-nav");
}
});

});


Ve aşağıdaki NAV gifini kullanmak isterseniz buradan alabilirsiniz umuyorum işinize yarar bir paylaşım olmuştur.



Herkeze kolaylıklar dilerim.

Kaynak konu: WMForumlari.NET
 

 

Türkiyenin Webmaster Topluluğu - Wmclubu.com
wmaraci
reklam

PanDooRa PanDooRa WM Aracı E-Mail Onaysız
  • Üyelik 25.01.2012
  • Yaş/Cinsiyet 37 / E
  • Meslek Webmaster
  • Konum Ankara
  • Ad Soyad M** K**
  • Mesajlar 398
  • Beğeniler 144 / 50
  • Ticaret 14, (%100)

position:fixed;
width:100%;
z-index:1;
top: 0;


böyle daha kolay gibi geldi bana. jquery kullanmaya gerek var mı?
 

 

4531 4531 WM Aracı Anonim Üyelik
  • Üyelik 13.03.2012
  • Yaş/Cinsiyet - /
  • Meslek
  • Konum
  • Ad Soyad ** **
  • Mesajlar 996
  • Beğeniler 210 / 211
  • Ticaret 3, (%100)
-Silindi-
 

 

ismail03 ismail03 WM Aracı Kullanıcı
  • Üyelik 28.11.2013
  • Yaş/Cinsiyet 29 / E
  • Meslek Ameliyathane Hemşiresi
  • Konum Afyon
  • Ad Soyad I** Ç**
  • Mesajlar 2633
  • Beğeniler 344 / 487
  • Ticaret 12, (%100)

ahmettalut adlı üyeden alıntı

Hocam php nerede? :D Bu arada http://stickyjs.com/ bu iş için en sevdiğim jquery eklentisi bu ve gerçekten çok kullanışlı.
https:/taluttasgiran.com.tr de bunu kullandım (sidebar için kullandım.).


bende bunu dicektim :) Jquery ve Css var
 

 

wmaraci
wmaraci

Webarazzi Webarazzi <?php print("Webarazzi"?> Kullanıcı
  • Üyelik 05.03.2016
  • Yaş/Cinsiyet 35 / E
  • Meslek Birtekno'loji Sahibi
  • Konum Çorum
  • Ad Soyad M** B**
  • Mesajlar 1068
  • Beğeniler 31 / 186
  • Ticaret 5, (%100)
ahmettalut & ismail03 konu yanlış yerde olabilir vs'de burda faydalanın diye birşey paylaşıyoruz siz gereksiz yorum atıyorsunuz biraz saygı.
 

 

Türkiyenin Webmaster Topluluğu - Wmclubu.com

ismail03 ismail03 WM Aracı Kullanıcı
  • Üyelik 28.11.2013
  • Yaş/Cinsiyet 29 / E
  • Meslek Ameliyathane Hemşiresi
  • Konum Afyon
  • Ad Soyad I** Ç**
  • Mesajlar 2633
  • Beğeniler 344 / 487
  • Ticaret 12, (%100)

TemaYeri adlı üyeden alıntı

ahmettalut & ismail03 konu yanlış yerde olabilir vs'de burda faydalanın diye birşey paylaşıyoruz siz gereksiz yorum atıyorsunuz biraz saygı.


Yok hocam :) teşekkürler sadece dikkat çekti
 

 

Webarazzi Webarazzi <?php print("Webarazzi"?> Kullanıcı
  • Üyelik 05.03.2016
  • Yaş/Cinsiyet 35 / E
  • Meslek Birtekno'loji Sahibi
  • Konum Çorum
  • Ad Soyad M** B**
  • Mesajlar 1068
  • Beğeniler 31 / 186
  • Ticaret 5, (%100)
ismail03 Ben teşekkür ederim modaratör arklar doğru yere alırlar yanlış yerde görünürse zaten.
 

 

Türkiyenin Webmaster Topluluğu - Wmclubu.com
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