Breadcrumb με κίνηση

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

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

Απάντηση
mpempe
Δημοσιεύσεις: 156
Εγγραφή: 23 Ιουν 2003 02:48
Τοποθεσία: peloponisos

Breadcrumb με κίνηση

Δημοσίευση από mpempe » 28 Ιαν 2013 03:42

Γεια σας θα ήθελα τη βοήθειά σας για ακόμη μια φορά σας παρακαλώ.

Έχω ένα Breadcrumb
http://jsfiddle.net/9H7QC/30/

στο οποίο όταν κάνω hover πάνω σε ένα link ανοίγει μέσω css και γίνεται πιο πλατύ.

Πώς θα μπορούσαμε να δώσουμε με jquery κίνηση στο άνοιγμα αυτών των links?

Ευχαριστώ εκ των προτέρων για κάθε βοήθεια.

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

Breadcrumb με κίνηση

Δημοσίευση από alou » 28 Ιαν 2013 19:56


mpempe
Δημοσιεύσεις: 156
Εγγραφή: 23 Ιουν 2003 02:48
Τοποθεσία: peloponisos

Breadcrumb με κίνηση

Δημοσίευση από mpempe » 28 Ιαν 2013 22:59

Πάρα πολύ ωραία.
Γινεται και το χρώμα κατα το hover in και out να κάνει fade in και fade out?

Άβαταρ μέλους
burnmind
Script Master
Δημοσιεύσεις: 954
Εγγραφή: 26 Σεπ 2009 02:14
Τοποθεσία: UK
Επικοινωνία:

Breadcrumb με κίνηση

Δημοσίευση από burnmind » 29 Ιαν 2013 00:58

http://jsfiddle.net/PAwWh/ (χρειάζεται το jQuery UI)

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

Breadcrumb με κίνηση

Δημοσίευση από alou » 29 Ιαν 2013 08:01

Σωστός ο burnmind, όμως υπάρχει και το css transition που δουλεύει ωραία για τέτοιες περιπτώσεις αν δε σε ενδιαφέρει ο ΙΕ (για λεπτομέρειες σαν αυτή καταπίνεται).

http://www.w3schools.com/css3/css3_transitions.asp

Προσωπικά θα το προτιμούσα έτσι και αλλιώς, πόσο μάλλον αν πρέπει να καλέσεις επιπλέον library μόνο για αυτό το λόγο.

Άβαταρ μέλους
burnmind
Script Master
Δημοσιεύσεις: 954
Εγγραφή: 26 Σεπ 2009 02:14
Τοποθεσία: UK
Επικοινωνία:

Breadcrumb με κίνηση

Δημοσίευση από burnmind » 29 Ιαν 2013 09:59

Σωστός ο alou, δεν πήγε καθόλου το μυαλό μου στη λύση των CSS transitions. Να την επιλέξεις, ιδιαίτερα αν πρόκειται να φορτώσεις το jQuery UI μόνο και μόνο γι' αυτό το effect.

Άβαταρ μέλους
korgr
Honorary Member
Δημοσιεύσεις: 5067
Εγγραφή: 07 Οκτ 2008 18:30
Τοποθεσία: Corinth
Επικοινωνία:

Breadcrumb με κίνηση

Δημοσίευση από korgr » 29 Ιαν 2013 10:32

Από την άλλη, κάτι που δεν δουλεύει σε κανέναν ΙΕ, γιατί να μην φάει ένα μεγαλο Χ την στιγμή που με jquery θα έχεις πλήρη συμβατότητα;
Απλά προβληματισμοί...

Άβαταρ μέλους
burnmind
Script Master
Δημοσιεύσεις: 954
Εγγραφή: 26 Σεπ 2009 02:14
Τοποθεσία: UK
Επικοινωνία:

Breadcrumb με κίνηση

Δημοσίευση από burnmind » 29 Ιαν 2013 10:43

Για να μη φορτώνεις τζάμπα το jQuery UI (δε λειτουργεί μόνο με jQuery το animation του color) μόνο και μόνο για ένα μικρό εφεδάκι όπως αυτό, που δε θα γίνει κάτι αν δεν το δει το ~15-30% των χρηστών σου που θα μπει με IE (όπως για παράδειγμα δε θα δει και rounded corners σε παλιότερους IE).

Γλυτώνεις ένα request, μερικά kbs (αν και λίγα καθώς μπορείς να φτιάξεις custom πακέτο του UI), και που θα πάει, κάποια στιγμή θα το υποστηρίξει και ο IE, αλλά και να μην, δε χάλασε ο κόσμος. Αν δε σε ενδιαφέρει το request και το extra size, τότε πας με το UI.

klix
Δημοσιεύσεις: 42
Εγγραφή: 03 Ιαν 2010 00:15
Τοποθεσία: Λονδίνο

Breadcrumb με κίνηση

Δημοσίευση από klix » 12 Μαρ 2013 02:36

Ίσως είναι καλό κάποιες φορές να στεκόμαστε και σε μια μέση λύση όμως ακόμη και αν δεν ικανοποιούμε το σύνολο των χρηστών. Άλλωστε ένα website σημασία έχει να είναι λειτουργικό σε όλες τις πλατφόρμες και στους διάφορους browsers που μας ενδιαφέρουν, δεν νομίζω πως χρειάζεται να είναι πανομοιότυπο σε εμφάνιση.
Δεδομένου λοιπόν ότι η απουσία αυτού του μικρού εφέ - που απλά θα πρόσθετε κάτι στο design και μόνο - από τον IE δεν θα επηρέαζε τη χρηστικότητα της σελίδας, αντιθέτως, η φόρτωση τοu jQuery UI θα πρόσθετε έστω και κάποια miliseconds στο συνολικό χρόνο φόρτωσης της σελίδας για όλους τους χρήστες, προσωπικά θα επέλεγα τη λύση του css transition για το χρώμα που ως fallback στον ΙΕ απλά θα άλλαζε το χρώμα χωρίς animation.
-What are we going to do tonight Brain?
-The same thing we do every night pinky,try to take over the world!

Άβαταρ μέλους
korgr
Honorary Member
Δημοσιεύσεις: 5067
Εγγραφή: 07 Οκτ 2008 18:30
Τοποθεσία: Corinth
Επικοινωνία:

Breadcrumb με κίνηση

Δημοσίευση από korgr » 12 Μαρ 2013 09:03

Διυλίζετε τον κώνωπα...
Υπάρχουν και τα CDNs, το script combining και κυρίως αρκετά σημεία πλέον στα σύγχρονα sites όπου φορτώνονται και η jQuery και το UI και για κάτι άλλο!

klix
Δημοσιεύσεις: 42
Εγγραφή: 03 Ιαν 2010 00:15
Τοποθεσία: Λονδίνο

Breadcrumb με κίνηση

Δημοσίευση από klix » 12 Μαρ 2013 21:55

Δεν αντιλέγω οτι είναι μικρές λεπτομέριες αυτά αλλά καλό είναι να υπάρχουν και διαφορετικές οπτικές για να βοηθηθεί και πιο πολύ ένας αρχάριος χρήστης πάνω στο τι θα επιλέξει να κάνει.
:D
-What are we going to do tonight Brain?
-The same thing we do every night pinky,try to take over the world!

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

Breadcrumb με κίνηση

Δημοσίευση από alou » 13 Μαρ 2013 08:02

Αυτά είναι διλλήματα που μόνο αρχάριο χρήστη δεν αφορούν.

Δημιουργούν όμως συνήθειες και καλό θα είναι να τις έχεις επιλέξει συνειδητά - και να τις επανεξετάζεις κάθε τόσο - και να ξέρεις γιατί τις απόκτησες. Και βέβαια δε μιλάω μόνο για το transition που είναι απολύτως διακοσμητικό στη συγκεκριμένη περίπτωση, αλλά για όλα τα css3 καλούδια, proprietary properties και τα fallback που θέλεις ή δεν θέλεις να έχεις.

klix
Δημοσιεύσεις: 42
Εγγραφή: 03 Ιαν 2010 00:15
Τοποθεσία: Λονδίνο

Breadcrumb με κίνηση

Δημοσίευση από klix » 13 Μαρ 2013 11:33

Epi ths eukairias, na kai ena link gia periptwseis kata tis opoies den eimaste sigouroi an kai kata poso prepei na xrhsimopoihsoume kati...

http://caniuse.com/

Elpizw na fanei xrhsimo :D
-What are we going to do tonight Brain?
-The same thing we do every night pinky,try to take over the world!

Απάντηση

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

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

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