Merhaba arkadaşlar,
Jquery ile çok güzel bir açılır kapanır menü yaptım fakat anlatamayacağım bir sorun mevcut http://gamelebi.com/wpmag buraya gidip tarayıcı boyunu 700px altı yapın ve menüyü açtığınızda oyun haberlerinin alt menülerinin üstüne gelin sorunu anlarsınız. Bu alt menülerde her hangi bir hover efekti bulunmuyor.
CSS Sorunu ( Açılır Kapanır Responsive Menüde Alt Menü ) |
7 Mesajlar | 3.358 Okunma | ||
- Üyelik 10.11.2013
- Yaş/Cinsiyet 27 / E
- Meslek Front-End Developer
- Konum Adana
- Ad Soyad S** D**
- Mesajlar 1345
- Beğeniler 234 / 472
- Ticaret 12, (%100)
sefacandemir.com.tr
- Üyelik 03.10.2013
- Yaş/Cinsiyet 44 / E
- Meslek Yazılım Uzmanı, Matematikçi
- Konum Ankara
- Ad Soyad S** T**
- Mesajlar 1119
- Beğeniler 325 / 324
- Ticaret 2, (%100)
Hocam, çalışmıyor bilgin olsun. Konsola baktığımda jquery felan bulunamadı diyor. Onları da sisteme atarsan rahatça çözüme kavuşturabiliriz.
www.ontedi.com
www.cizgi.site
www.cizgi.site
- Üyelik 10.11.2013
- Yaş/Cinsiyet 27 / E
- Meslek Front-End Developer
- Konum Adana
- Ad Soyad S** D**
- Mesajlar 1345
- Beğeniler 234 / 472
- Ticaret 12, (%100)
ontedi hocam temayı localhostta kodladım tüm bağlantılar localhost'da kalmış jquery dahi ben onları bi düzenleyeyim tekrar bakarsınız... :)
Edit: Bağlantılar Düzenlendi bilgili bir arkadaş yok mu acaba ?
Edit: Bağlantılar Düzenlendi bilgili bir arkadaş yok mu acaba ?
sefacandemir.com.tr
- Üyelik 03.10.2013
- Yaş/Cinsiyet 44 / E
- Meslek Yazılım Uzmanı, Matematikçi
- Konum Ankara
- Ad Soyad S** T**
- Mesajlar 1119
- Beğeniler 325 / 324
- Ticaret 2, (%100)
Hocam, menüyü açıp kapayan fonksiyonunuzun düzeltilmesi gerekir. Açıkcası ayrıntılı incelemek gerekiyor.
Kendi yazdığım responsive menü örneğini burada paylaşırım yakında. Şuan onu söküp almak biraz uğraştırıcı.
Ama şöyle bir örnek verebilirim.
Açıklaması şu şekilde, menu-kapsul sınıfının içerisindeki li elementlerinin üzerine gelince bu li elementinin içindeki ilk ul elementini gösteriyor veya gizliyor.
Kendi yazdığım responsive menü örneğini burada paylaşırım yakında. Şuan onu söküp almak biraz uğraştırıcı.
Ama şöyle bir örnek verebilirim.
jQuery(".menu-kapsul ul li").hover(
function () {
if (jQuery(this).find("ul").length) {
jQuery(this).find("> ul").stop().fadeIn("300");
} else {
jQuery(this).find("> ul").stop().fadeIn("300");
}
},
function () {
if (jQuery(this).find("ul").length) {
jQuery(this).find("> ul").stop(true, true).hide();
} else {
jQuery(this).find("> ul").stop(true, true).hide();
}
}
);
Açıklaması şu şekilde, menu-kapsul sınıfının içerisindeki li elementlerinin üzerine gelince bu li elementinin içindeki ilk ul elementini gösteriyor veya gizliyor.
www.ontedi.com
www.cizgi.site
www.cizgi.site
- Üyelik 10.11.2013
- Yaş/Cinsiyet 27 / E
- Meslek Front-End Developer
- Konum Adana
- Ad Soyad S** D**
- Mesajlar 1345
- Beğeniler 234 / 472
- Ticaret 12, (%100)
Hocam ben li elementinin içnideki ul yi css de display none yaparak gizledim ve li:hover ul diyerek display:block yaptım bu işlemlede li elementinin üstüne gelince ul elemnti görünür oluyor fakat responsive şekildeyken bu li ementinin hoverını işlevsiz kılmam gerekiyor bunu nasıl yapabilirim ? media ile display:none yapınca bu sefer alt menü gözükmüyor benim o li:hover ul yi 700px altındayken çalışmaz hale getirmem lazım. ontedi
sefacandemir.com.tr
- Üyelik 03.10.2013
- Yaş/Cinsiyet 44 / E
- Meslek Yazılım Uzmanı, Matematikçi
- Konum Ankara
- Ad Soyad S** T**
- Mesajlar 1119
- Beğeniler 325 / 324
- Ticaret 2, (%100)
Hocam buyur o zaman,
diemold.net/en/
adresinde uygulamıştım. Oradan css kısmına da bakabilirsin.
/* Mikro Menü (BAŞLANGIÇ) */
function fnMikro_Menu() {
var intEkran_Genislik = jQuery(document).outerWidth(false);
if (intEkran_Genislik >= 700) {
jQuery(".mikro-acilir-menu ul li").hover(
function () {
if (jQuery(this).find("ul").length) {
jQuery(this).find("> ul").stop().fadeIn("300");
} else {
jQuery(this).find("> ul").stop().fadeIn("300");
}
},
function () {
if (jQuery(this).find("ul").length) {
jQuery(this).find("> ul").stop(true, true).hide();
} else {
jQuery(this).find("> ul").stop(true, true).hide();
}
}
);
}
jQuery(".mikro-acilir-menu ul li ul").each(function () {
jQuery(this).parent("li").append("");
});
jQuery(".mikro-acilir-menu .mobil-ac-kapa button").click(function () {
if (jQuery(".mikro-acilir-menu > ul").hasClass("mobil") == true) {
jQuery(this).removeClass("aktif");
jQuery(".mikro-acilir-menu > ul").removeClass("mobil");
}
else {
jQuery(this).addClass("aktif");
jQuery(".mikro-acilir-menu > ul").addClass("mobil");
}
});
jQuery(".mikro-acilir-menu ul li p").click(function () {
if (jQuery(this).prev("ul").css("display") == 'none') {
jQuery(this).prev("ul").removeClass("dn");
jQuery(this).prev("ul").addClass("db");
}
else {
jQuery(this).prev("ul").removeClass("db");
jQuery(this).prev("ul").addClass("dn");
}
});
}
fnMikro_Menu();
/* Mikro Menü (BİTİŞ) */
diemold.net/en/
adresinde uygulamıştım. Oradan css kısmına da bakabilirsin.
www.ontedi.com
www.cizgi.site
www.cizgi.site
- Üyelik 10.11.2013
- Yaş/Cinsiyet 27 / E
- Meslek Front-End Developer
- Konum Adana
- Ad Soyad S** D**
- Mesajlar 1345
- Beğeniler 234 / 472
- Ticaret 12, (%100)
Hocam ilgilendiğiniz için çok teşekkür ederim. Sorun position'daymış absolute old. için alt eleman olarak gösteriyordu media dan postion relative yapınca düzeldi menü :) ontedi
sefacandemir.com.tr
Konuyu toplam 1 kişi okuyor. (0 kullanıcı ve 1 misafir)