lostyazilim

Menüyü nasıl sabitleyebilirim?

13 Mesajlar 2.096 Okunma
lstbozum
wmaraci reklam

Mertcan Mertcan Hayat kısa, kuşlar uçuyor Kullanıcı
  • Üyelik 05.02.2012
  • Yaş/Cinsiyet 29 / E
  • Meslek Yatırım
  • Konum Antalya
  • Ad Soyad M** K**
  • Mesajlar 5426
  • Beğeniler 39 / 1529
  • Ticaret 38, (%100)
Selam arkadaşlar;

Bir menü kullanmaya başladım sitemde. Ancak sayfayı aşağıya kaydırdıkça menüde ekranı takip ediyor. Bunu nasıl engelleyebilirim?
FTP'ye bir .js uzantısı gönderdim, onunla alakalı olabilir mi?
Kodları ekleyeyim:

$(function() {
var d=300;
$('#navigation a').each(function(){
$(this).stop().animate({
'marginTop':'-80px'
},d+=150);
});

$('#navigation > li').hover(
function () {
$('a',$(this)).stop().animate({
'marginTop':'-2px'
},200);
},
function () {
$('a',$(this)).stop().animate({
'marginTop':'-80px'
},200);
}
);
});


Eğer CSS veya HTML kodları ile alakalıysa onları da verebilirim.
 

 

Tomurcuk derdinde olmayan ağaç, odundur.
wmaraci
reklam

SerkanERGUN SerkanERGUN WM Aracı Kullanıcı
  • Üyelik 14.11.2012
  • Yaş/Cinsiyet 38 / E
  • Meslek Ticaret
  • Konum İstanbul Avrupa
  • Ad Soyad S** E**
  • Mesajlar 2894
  • Beğeniler 1339 / 1338
  • Ticaret 249, (%100)
Sahifa Teması mı ?
 

 

Serkan ERGÜN - Her şeyi denerim; ama yapabildiklerimi yaparım.

Mertcan Mertcan Hayat kısa, kuşlar uçuyor Kullanıcı
  • Üyelik 05.02.2012
  • Yaş/Cinsiyet 29 / E
  • Meslek Yatırım
  • Konum Antalya
  • Ad Soyad M** K**
  • Mesajlar 5426
  • Beğeniler 39 / 1529
  • Ticaret 38, (%100)


Tema değil bu HTML - CSS hazır bir menü.
 

 

Tomurcuk derdinde olmayan ağaç, odundur.

SerkanERGUN SerkanERGUN WM Aracı Kullanıcı
  • Üyelik 14.11.2012
  • Yaş/Cinsiyet 38 / E
  • Meslek Ticaret
  • Konum İstanbul Avrupa
  • Ad Soyad S** E**
  • Mesajlar 2894
  • Beğeniler 1339 / 1338
  • Ticaret 249, (%100)

Mertcan adlı üyeden alıntı

Tema değil bu HTML - CSS hazır bir menü.


Anlıyorum Sahifa temasında konuda ifade ettiğiniz gibi bir görüntü var o sandım O olmuş olsaydı yardımcı olabilirdim Ama bunda bilgim yok İyi forumlar.
 

 

Serkan ERGÜN - Her şeyi denerim; ama yapabildiklerimi yaparım.
wmaraci
wmaraci

Mertcan Mertcan Hayat kısa, kuşlar uçuyor Kullanıcı
  • Üyelik 05.02.2012
  • Yaş/Cinsiyet 29 / E
  • Meslek Yatırım
  • Konum Antalya
  • Ad Soyad M** K**
  • Mesajlar 5426
  • Beğeniler 39 / 1529
  • Ticaret 38, (%100)

Serkan ALAZ adlı üyeden alıntı

Anlıyorum Sahifa temasında konuda ifade ettiğiniz gibi bir görüntü var o sandım O olmuş olsaydı yardımcı olabilirdim Ama bunda bilgim yok İyi forumlar.


Anladım. Hazır bir menü ve biraz karışık, bende gerekli düzenlemeyi yapamadım onun için konu açtım.
Teşekkür ediyorum.
 

 

Tomurcuk derdinde olmayan ağaç, odundur.

DenizOZTURK DenizOZTURK WM Aracı Kullanıcı
  • Üyelik 02.02.2014
  • Yaş/Cinsiyet 26 / E
  • Meslek -
  • Konum Diğer
  • Ad Soyad D** Ö**
  • Mesajlar 479
  • Beğeniler 189 / 158
  • Ticaret 4, (%100)
HTML CSS Kodları verin yardımcı olayım . Demo varsa da olur .
 

 

Mertcan Mertcan Hayat kısa, kuşlar uçuyor Kullanıcı
  • Üyelik 05.02.2012
  • Yaş/Cinsiyet 29 / E
  • Meslek Yatırım
  • Konum Antalya
  • Ad Soyad M** K**
  • Mesajlar 5426
  • Beğeniler 39 / 1529
  • Ticaret 38, (%100)

Deniz ÖZTÜRK adlı üyeden alıntı

HTML CSS Kodları verin yardımcı olayım . Demo varsa da olur .


Tabiiki buyrun:

HTML Kodları:



CSS Kodları:

ul#navigation {
position: fixed;
margin: 0px;
padding: 0px;
top: 0px;
right: 10px;
list-style: none;
z-index:999999;
width:721px;
}

ul#navigation li {
width: 103px;
display:inline;
float:left;
}

ul#navigation li a {
display: block;
float: left;
margin-top: -2px;
width: 100px;
height: 25px;
background-color: #E7F2F9;
background-repeat: no-repeat;
background-position: 50% 10px;
border: 1px solid #BDDCEF;
text-decoration: none;
text-align: center;
padding-top: 80px;
}

ul#navigation li a {
display: block;
float:left;
margin-top: -2px;
width: 100px;
height: 25px;
background-color:#E7F2F9;
background-repeat:no-repeat;
background-position:50% 10px;
border:1px solid #BDDCEF;
text-decoration:none;
text-align:center;
padding-top:80px;
-moz-border-radius:0px 0px 10px 10px;
-webkit-border-bottom-right-radius: 10px;
-webkit-border-bottom-left-radius: 10px;
-khtml-border-bottom-right-radius: 10px;
-khtml-border-bottom-left-radius: 10px;
opacity: 0.7;
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=70);
}

ul#navigation .home a{
background-image: url(../images/home.png);
}
ul#navigation .about a {
background-image: url(../images/id_card.png);
}
ul#navigation .search a {
background-image: url(../images/search.png);
}
ul#navigation .podcasts a {
background-image: url(../images/ipod.png);
}
ul#navigation .rssfeed a {
background-image: url(../images/rss.png);
}
ul#navigation .photos a {
background-image: url(../images/camera.png);
}
ul#navigation .contact a {
background-image: url(../images/mail.png);
}

ul#navigation li a:hover{
background-color:#CAE3F2;
}

ul#navigation li a span{
letter-spacing:2px;
font-size:11px;
color:#60ACD8;
text-shadow: 0 -1px 1px #fff;
}


JAVA Script Kodları:

$(function() {
var d=300;
$('#navigation a').each(function(){
$(this).stop().animate({
'marginTop':'-80px'
},d+=150);
});

$('#navigation > li').hover(
function () {
$('a',$(this)).stop().animate({
'marginTop':'-2px'
},200);
},
function () {
$('a',$(this)).stop().animate({
'marginTop':'-80px'
},200);
}
);
});
 

 

Tomurcuk derdinde olmayan ağaç, odundur.

DenizOZTURK DenizOZTURK WM Aracı Kullanıcı
  • Üyelik 02.02.2014
  • Yaş/Cinsiyet 26 / E
  • Meslek -
  • Konum Diğer
  • Ad Soyad D** Ö**
  • Mesajlar 479
  • Beğeniler 189 / 158
  • Ticaret 4, (%100)
Buyrun Sanırım istediğiniz böyle birşey : http://jsfiddle.net/ngLE5/

CSS'de Bulunan position: fixed; kodundan kaynaklı position: absolute; yaparak sorun giderildi .
 

 

Mertcan Mertcan Hayat kısa, kuşlar uçuyor Kullanıcı
  • Üyelik 05.02.2012
  • Yaş/Cinsiyet 29 / E
  • Meslek Yatırım
  • Konum Antalya
  • Ad Soyad M** K**
  • Mesajlar 5426
  • Beğeniler 39 / 1529
  • Ticaret 38, (%100)

Deniz ÖZTÜRK adlı üyeden alıntı

Buyrun Sanırım istediğiniz böyle birşey : http://jsfiddle.net/ngLE5/

CSS'de Bulunan position: fixed; kodundan kaynaklı position: absolute; yaparak sorun giderildi .


Burada birşey anlayamadım ki ne yaptığınızı?
Şimdi durum şöyle, bu menüyü sayfanın en üstüne ekliyorum.
Ancak sayfada aşağıya inince ekranın üzerinde menü takip ediyor, ben sayfayı aşağıya çektiğimde menünün orada kalmasını istiyorum.:rolleyes:
 

 

Tomurcuk derdinde olmayan ağaç, odundur.

DenizOZTURK DenizOZTURK WM Aracı Kullanıcı
  • Üyelik 02.02.2014
  • Yaş/Cinsiyet 26 / E
  • Meslek -
  • Konum Diğer
  • Ad Soyad D** Ö**
  • Mesajlar 479
  • Beğeniler 189 / 158
  • Ticaret 4, (%100)

Mertcan adlı üyeden alıntı

Burada birşey anlayamadım ki ne yaptığınızı?
Şimdi durum şöyle, bu menüyü sayfanın en üstüne ekliyorum.
Ancak sayfada aşağıya inince ekranın üzerinde menü takip ediyor, ben sayfayı aşağıya çektiğimde menünün orada kalmasını istiyorum.:rolleyes:


Tamam işte CSS Dosyalarınızda ul#navigation 'da bulunan position: fixed; kodunu position: absolute; yapınca sorununuz çözülecek
 

 

wmaraci
Konuyu toplam 4 kişi okuyor. (0 kullanıcı ve 4 misafir)
Site Ayarları
  • Tema Seçeneği
  • Site Sesleri
  • Bildirimler
  • Özel Mesaj Al