Menu με 2 directions...

Κώδικας, πληροφορίες, ερωτήσεις και απαντήσεις σχετικές με την JavaScript.

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

Απάντηση
pekovic13
Δημοσιεύσεις: 170
Εγγραφή: 12 Φεβ 2011 17:30

Menu με 2 directions...

Δημοσίευση από pekovic13 » 23 Μαρ 2012 11:31

Καλημέρα παιδιά.
Θέλω ένα menu σαν αυτό http://www.kriesi.at/wp-content/extra_d ... step4.html
αλλά με μια τροποποίηση. Θέλω να έχει 2 αυτόματες κατευθύνσεις... Δηλαδή όταν πάει ας πούμε στο 3ο tab να μην ανοίγει το υπομενού δεξιά αλλά αριστερά αφου θα του έχω ορίσει ένα συγκεκριμένο width από το οποίο δεν θέλω να ξεφεύεγει...
Έχω φάει το κόσμο να βρω ένα τέτοιο αλλά τίποτα...

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

Menu με 2 directions...

Δημοσίευση από alou » 23 Μαρ 2012 18:28

Αυτό θα το λύσεις εύκολα με css λογικά αλλά φτιάξε πρώτα την HTML για να μιλήσουμε πιο συγκεκριμένα.

edit παράδειγμα που αν κατάλαβα τι θες κάνει αυτή τη δουλειά, χωρίς js. Αν θες εφέ στο άνοιγμα το βλέπεις.
HTML

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

<nav>
	<ul id="menu">
    	<li id="item1">menu 1
        	<ul class="sub">
            	<li>sub 1</li>
            	<li>sub 2</li>
            	<li>sub 3</li>
            </ul>
        </li>
        <li id="item2">menu 2</li>
        <li id="item3">menu 3</li>
        <li id="item4">menu 4
        	<ul class="sub">
            	<li>sub 1</li>
            	<li>sub 2</li>
            	<li>sub 3</li>
            </ul>
        </li>
	</ul>
</nav>
CSS

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

ul#menu, ul#menu ul &#123;list-style&#58;none;padding&#58;0px;margin&#58;0px;&#125;
ul#menu &#123;position&#58;relative;margin&#58;0px auto;&#125;
ul#menu li &#123;display&#58;inline;position&#58;relative;width&#58;100px;padding&#58;0px 10px;&#125;
ul#menu li li &#123;display&#58;none;width&#58;150px;background&#58;#dedede;&#125;
ul#menu li#item1 ul &#123;position&#58;absolute;right&#58;0px;&#125;
ul#menu li#item4 ul &#123;position&#58;absolute;left&#58;0px;&#125;
ul#menu li&#58;hover li &#123;display&#58;block;&#125;

Απάντηση

Επιστροφή στο “JavaScript και Frameworks”

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

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