2 Ερωτήσεις για menu και για μια λειτουργία PLZZZZ HEEELP

Από που να ξεκινήσω; Που θα βρω; κ.α. γενικές ερωτήσεις για την δημιουργία μιας ιστοσελίδας.

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

Απάντηση
inviribus
Δημοσιεύσεις: 10
Εγγραφή: 17 Ιουν 2009 12:16

2 Ερωτήσεις για menu και για μια λειτουργία PLZZZZ HEEELP

Δημοσίευση από inviribus » 29 Μαρ 2012 16:28

Καλησπέρα παιδιά

Θα ήθελα να ρωτήσω αν έχετε υπόψιν κάποιο multi level menu το οποίο στο πρωτο level να είναι drop down και τα επόμενα level να τα κάνω vertical accrordion.

Αν δεν ξέρετε έχετε καμιά ιδέα πως μπορεί να γίνει?

Και η δεύτερη ερώτηση είναι πως μπορώ να κρατάω ένα μέρος της σελίδας σταθερό και το από κάτω σε περίπτωση που είναι σεντόνι να scrollarei από κάτω σαν να μπαίνει από κάτω από το πάνω μέρος?

Για να το κάνω ποιο κατανοητό έστω ένα page στο οποίο θα κρατάμε σταθερό το header και το contenτ από κάτω με πολύ περιεχόμενο να scrollarei κάτω από το header όσο κατεβαίνουμε

μπορείτε να δείτε παράδειγμα εδώ http://themes.pixelworkshop.fr/?theme=CSS3MegaMenu

Ευχαριστώ πολύ

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

2 Ερωτήσεις για menu και για μια λειτουργία PLZZZZ HEEELP

Δημοσίευση από alou » 29 Μαρ 2012 17:49

Κάπως έτσι
html

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

<body style="font-family&#58; Arial, Sans-serif, sans;text-align&#58;center;">
<div id="container">
<nav>
	<ul class="menu">
    	<li>Πρώτο</li>
        <li>Έχει submenu
        	<ul class="level2">
            	<li>level2-1</li>
                <li class="parent">Έχει submenu
                	<ul class="level3">
                    	<li>level3-1</li>
                        <li>level3-2</li>
                        <li>level3-3</li>
                    </ul>
                </li>
                <li>level2-3</li>
            </ul>
        </li>
        <li>trito
        
        </li>
    </ul>
</nav>
</div>
</body>
css

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

#container &#123;width&#58;800px;margin&#58;0 auto;&#125;
ul.menu, ul.menu ul &#123;list-style&#58;none;padding&#58;0px;margin&#58;0px;cursor&#58;pointer;&#125;
ul.menu li &#123;width&#58;150px;text-align&#58;center;float&#58;left;border&#58;1px dashed #333;&#125;
ul.menu li&#58;hover &#123;background&#58;#dadada;&#125;
ul.menu ul &#123;display&#58;none;&#125;
ul.menu ul li &#123;float&#58;none;&#125;
ul.menu li&#58;hover ul &#123;display&#58;block;&#125;
ul.menu li&#58;hover ul ul &#123;list-style&#58;circle&#125;
js (jQuery)

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

$&#40;document&#41;.ready&#40;function&#40;&#41;&#123; 
	$&#40;'ul.menu ul ul'&#41;.hide&#40;&#41;;
	$&#40;'ul.menu ul li.parent'&#41;.click&#40;function&#40;&#41; &#123;
		$&#40;this&#41;.children&#40;'ul'&#41;.slideToggle&#40;&#41;;
	&#125;&#41;
&#125;&#41;
Η ουσία είναι ότι παίζεις με css στα 2 1α level και μετά με js, αν κατάλαβα καλά αυτό που θες.

Για το κομμάτι που θες να είναι σταθερό, στο css σου χρησιμοποιείς fixed position.

inviribus
Δημοσιεύσεις: 10
Εγγραφή: 17 Ιουν 2009 12:16

2 Ερωτήσεις για menu και για μια λειτουργία PLZZZZ HEEELP

Δημοσίευση από inviribus » 30 Μαρ 2012 12:28

Ευχαριστώ πολύ για την απάντηση σου όμως δεν είναι ακριβως αυτό που θέλω

για καλύτερη διευκρίνηση έχω κάνει attach ένα σκιτσάκι

Μήπως έχεις καμιά ιδέα??

Ευχαριστώ πολύ και πάλι
Συνημμένα
Menu example.jpg

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

2 Ερωτήσεις για menu και για μια λειτουργία PLZZZZ HEEELP

Δημοσίευση από alou » 30 Μαρ 2012 15:39

Σε τι διαφέρει η δομή σου από αυτό που σου έγραψα;
Το δοκίμασες καταρχάς; Κάνει ακριβώς αυτό που δείχνεις, το 2o level είναι drop down και το 3ο ανοίγει με click σαν accordion.

Δες εδώ παράδειγμα (είναι ακριβώς αυτό που σου έγραψα).

inviribus
Δημοσιεύσεις: 10
Εγγραφή: 17 Ιουν 2009 12:16

2 Ερωτήσεις για menu και για μια λειτουργία PLZZZZ HEEELP

Δημοσίευση από inviribus » 30 Μαρ 2012 17:04

Ευχαριστώ πάρα πολύ

Πραγματικά ευχαριστώ είχα κάνει κάτι λάθος αλλά με το παράδειγμα σου το διόρθωσα


Συγνώμη για την παρανόηση

Και πάλι ευχαριστώ

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

2 Ερωτήσεις για menu και για μια λειτουργία PLZZZZ HEEELP

Δημοσίευση από alou » 30 Μαρ 2012 20:27

Νο πρόμπλεμ :D

inviribus
Δημοσιεύσεις: 10
Εγγραφή: 17 Ιουν 2009 12:16

2 Ερωτήσεις για menu και για μια λειτουργία PLZZZZ HEEELP

Δημοσίευση από inviribus » 06 Απρ 2012 15:31

Καλησπέρα να σε ρωτήσω και κάτι άλλο πάνω σε αυτό το menu???

Πως μπορώ να αλλάξω το background στο ας πούμε στο πρώτο level του menu να έχει background ένα .png στο πλαίσιο που βγάζει από κάτω να έχω ένα άλλο η να έχω ένα χρώμα??

Και πως γίνεται τα πλαίσια να έχουνε κατά κάποιο τρόπο width αυτόματο για παράδειγμα μπορεί να έχουν διαφορετικό μήκος τα γράμματα που θα είναι στα υποmenu

Και κάτι τελευταίο άμα έχω δυο μενυ η κάτι άλλο κάτω από το μενυ πως μπορώ να το κάνω να είναι από πάνω δηλαδή όταν δείχνει τα υπο μενυ να μην σπρώχνει τα από κάτω αλλά να τα καλύπτει???

Συγνώμη για τις πολλές ερωτήσεις

Ευχαριστώ πολύ

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

2 Ερωτήσεις για menu και για μια λειτουργία PLZZZZ HEEELP

Δημοσίευση από alou » 06 Απρ 2012 17:04

inviribus έγραψε: Πως μπορώ να αλλάξω το background στο ας πούμε στο πρώτο level του menu να έχει background ένα .png στο πλαίσιο που βγάζει από κάτω να έχω ένα άλλο η να έχω ένα χρώμα??
Ευχαριστώ πολύ
Τα στοιχεία κληρονομούν τις περισσότερες ιδιότητές τους από το γονικό, εκτός αν δηλώσεις κάτι συγκεκριμένο. Δηλαδή, αν πεις

ul.menu {background:black} τα child elements (ul.menu ul, ul.menu ul ul ...) θα έχουν επίσης μαύρο φόντο, εκτός αν πεις:

ul.menu ul {backtound:white} οπότε το δεύτερο ul και μετά θα έχει άσπρο φόντο.

Από εκεί και πέρα, βάζεις αυτά που χρειάζεται να βάλεις για το αποτέλεσμα που θες.
inviribus έγραψε:
Και πως γίνεται τα πλαίσια να έχουνε κατά κάποιο τρόπο width αυτόματο για παράδειγμα μπορεί να έχουν διαφορετικό μήκος τα γράμματα που θα είναι στα υποmenu
Δεν θα δηλώσεις κάποιο width στα li elements, καλό θα είναι να αφήσεις όμως κάποιο περιθώριο (padding).
inviribus έγραψε: Και κάτι τελευταίο άμα έχω δυο μενυ η κάτι άλλο κάτω από το μενυ πως μπορώ να το κάνω να είναι από πάνω δηλαδή όταν δείχνει τα υπο μενυ να μην σπρώχνει τα από κάτω αλλά να τα καλύπτει???
Θα πρέπει να γίνουν absolute positioned, ώστε να μην επηρεάζουν / επηρεάζονται από τη ροή των υπόλοιπων στοιχείων.

Απάντηση

Επιστροφή στο “Γενικές ερωτήσεις κατασκευής ιστοσελίδων”

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

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