Για καποιο λογο το μενου δε δουλευει σωστα

Ας μάθουμε πως να κάνουμε τις σελίδες μας με στιλ. Τα Cascading Style Sheets είναι ο τρόπος για να το επιτύχουμε.

Συντονιστές: WebDev Moderators, Super-Moderators

Απάντηση
Άβαταρ μέλους
ideal
Δημοσιεύσεις: 302
Εγγραφή: 12 Φεβ 2011 16:26

Για καποιο λογο το μενου δε δουλευει σωστα

Δημοσίευση από ideal » 27 Μαρ 2013 23:29

Καλησπερα. Αντεγραψα ενα μενου το οποιο λειτουργουσε κανονικα στην αρχικη σελιδα. Στη σελιδα που το αντεγραψα δε λειτουργει οπως πρεπει: 1)οταν φευγουμε απο το link αναβοσβηνουνε οι συνδεσεις του υπομενου 2) αν τρεξουμε τον κερσορα πανω στα links παραμενει το "ιχνος" απο το προηγουμενο στα sublinks. Δεν ξερω αν εχω πειραξει κατι καταλαθος.
Το μενου που δουλευει σωστα εδω και το μενου μου εδω.
Δεν μπορούμε να λύσουμε τα προβλήματά μας χρησιμοποιώντας τον ίδιο τρόπο σκέψης που χρησιμοποιήσαμε όταν τα δημιουργήσαμε. -Α. Einstein

Rent a Car

alou
Script Master
Δημοσιεύσεις: 1374
Εγγραφή: 24 Αύγ 2007 19:52
Επικοινωνία:

Για καποιο λογο το μενου δε δουλευει σωστα

Δημοσίευση από alou » 28 Μαρ 2013 09:55

Περίεργο είναι, για δοκίμασε αντικαθιστώντας το hover με mouseenter στο js function, δε χρειάζεται να αλλάξεις κάτι άλλο.

Φαίνεται ότι για κάποιο λόγο γίνεται trigger το mouseleave τρέχοντας το ίδιο function 2 φορές (?) στο a element που δηλώνεις.

Κώδικας: Επιλογή όλων

$(document).ready(function(){
	$("#main-nav li a.main-link").mouseenter(function(){
		$("#main-nav li a.close").fadeIn();
		$("#main-nav li a.main-link").removeClass("active");												 
		$(this).addClass("active");										 
		$("#sub-link-bar").fadeIn();
		$(".sub-links").hide();
		$(this).siblings(".sub-links").fadeIn();
	});
	$("#main-nav li a.close").click(function(){
		$("#main-nav li a.main-link").removeClass("active");												 									 
		$(".sub-links").fadeOut();
		$("#sub-link-bar").fadeOut();
		$("#main-nav li a.close").fadeOut();
	});
	
	
});
Η hover παίρνει και μια δεύτερη fn για το mouseleave event, πιθανολογώ ότι για κάποιο λόγο τρέχει 2 φορές η πρώτη fn και στα 2 event. Πιθανώς κάτι τέτοιο θα μας έλυνε την απορία:

Κώδικας: Επιλογή όλων

$(document).ready(function(){
	$("#main-nav li a.main-link").hover(function(){
		$("#main-nav li a.close").fadeIn();
		$("#main-nav li a.main-link").removeClass("active");												 
		$(this).addClass("active");										 
		$("#sub-link-bar").fadeIn();
		$(".sub-links").hide();
		$(this).siblings(".sub-links").fadeIn();
	}, function() {} //μια κενή function για το mouseleave event.

);
	...
	
	
});

Άβαταρ μέλους
ideal
Δημοσιεύσεις: 302
Εγγραφή: 12 Φεβ 2011 16:26

Για καποιο λογο το μενου δε δουλευει σωστα

Δημοσίευση από ideal » 28 Μαρ 2013 16:19

Ε εισαι απλα φοβερος!!! :respect: :respect:
Αυτο ηταν. Το ανεβαζω κιολας να το δεις. Πού ομως οφειλοταν αυτο; Μπορει με καποιο τροπο να δικαιολογηθει;
Ευχαριστω παρα πολυ (για αλλη μια φορα)!

edit: Ενω εσβησε το ιχνος καποιες φορες κανει ακομα το αναβοσβημα. Κυριως στο ROUTES φαινεται εντονα.
Δεν μπορούμε να λύσουμε τα προβλήματά μας χρησιμοποιώντας τον ίδιο τρόπο σκέψης που χρησιμοποιήσαμε όταν τα δημιουργήσαμε. -Α. Einstein

Rent a Car

alou
Script Master
Δημοσιεύσεις: 1374
Εγγραφή: 24 Αύγ 2007 19:52
Επικοινωνία:

Για καποιο λογο το μενου δε δουλευει σωστα

Δημοσίευση από alou » 28 Μαρ 2013 16:41

Έτσι θα δουλεύει καλύτερα

Κώδικας: Επιλογή όλων

$("#main-nav > li a.main-link").hover(function(){
		if (!$(this).hasClass('active')) {
			$("#main-nav li a.close").fadeIn();
			$("#main-nav li a.main-link").removeClass("active");												 
			$(this).addClass("active");										 
			$("#sub-link-bar").fadeIn();
			$(".sub-links").hide();
			$(this).siblings(".sub-links").fadeIn();
		}
	});

Άβαταρ μέλους
ideal
Δημοσιεύσεις: 302
Εγγραφή: 12 Φεβ 2011 16:26

Για καποιο λογο το μενου δε δουλευει σωστα

Δημοσίευση από ideal » 28 Μαρ 2013 17:09

alou έγραψε:Έτσι θα δουλεύει καλύτερα

Κώδικας: Επιλογή όλων

$("#main-nav > li a.main-link").hover(function(){
		if (!$(this).hasClass('active')) {
			$("#main-nav li a.close").fadeIn();
			$("#main-nav li a.main-link").removeClass("active");												 
			$(this).addClass("active");										 
			$("#sub-link-bar").fadeIn();
			$(".sub-links").hide();
			$(this).siblings(".sub-links").fadeIn();
		}
	});
Πραγματι! Ευχαριστω πολυ! :D
Δεν μπορούμε να λύσουμε τα προβλήματά μας χρησιμοποιώντας τον ίδιο τρόπο σκέψης που χρησιμοποιήσαμε όταν τα δημιουργήσαμε. -Α. Einstein

Rent a Car

alou
Script Master
Δημοσιεύσεις: 1374
Εγγραφή: 24 Αύγ 2007 19:52
Επικοινωνία:

Για καποιο λογο το μενου δε δουλευει σωστα

Δημοσίευση από alou » 28 Μαρ 2013 19:55

Νάσαι καλά ;)

Απάντηση

Επιστροφή στο “CSS - Cascading Style Sheets”

Μέλη σε σύνδεση

Μέλη σε αυτήν τη Δ. Συζήτηση: Δεν υπάρχουν εγγεγραμμένα μέλη και 0 επισκέπτες