Προσπάθησα να βάλω ένα "animation gif" να παίξει σε css στην κατάσταση "hover" αλλά συμβαίνει το εξής:
Να πω πρώτα οτι το animation gif είναι ρυθμισμένο από το "Fireworks" να παίζει μία φορά και όχι να κάνει looping forever ,επίσης το animation περιέχει 4 "stage".
Όταν το mouse περνά πάνω από το κουμπί του μενού την πρώτη φορά το animation παίζει μια φορά και σταματάει, αν το mouse φύγει έξω από το κουμπί και ξαναπεράσει από πάνω του παίζει το τελευταίο stage του animation(δεν υπάρχει κίνηση).Οσες φορές βγει έξω από το κουμπί το mouse και ξαναπεράσει από πάνω του συμβαίνει το ίδιο.
Προσπάθησα να βάλω το ίδιο animation gif σαν "swap image" από τα "Behaviors" του Dreamweaver και βλέπω ότι παίζει κανονικά(μια φορά πάντα) όσες φορές το Mouse περάσει και φύγει από το κουμπί.
Ο κώδικας Css:
.menu_cell_1 {
height: 30px;
width: 100px;
background-color: #FFF;
text-align: center;
background-image: url(image.gif);
}
.menu_cell_1:hover{
height: 30px;
width: 100px;
background-image: url(image_animation.gif);
Υπάρχει κάποια λύση ωστε το "animation gif" να παίζει πάλι όταν απομακρυνθεί και ξαναπεράσει από πάνω του το mouse;
Αnimation Gif στην κατάσταση "Hover"
Συντονιστές: WebDev Moderators, Super-Moderators
Αnimation Gif στην κατάσταση "Hover"
Δεν ξέρω αν σας έδωσα να καταλάβετε
-
- Honorary Member
- Δημοσιεύσεις: 1869
- Εγγραφή: 21 Φεβ 2003 01:21
- Τοποθεσία: Μια εδώ.. Μια εκεί.. Σήμερα είμαι εδώ!!!
- Επικοινωνία:
Αnimation Gif στην κατάσταση "Hover"
πρέπει να το κάνεις με js
πχ με jquery
πχ με jquery
Κώδικας: Επιλογή όλων
$(function() {
$('.menu_cell_1').hover(function() {
$(this).attr('src','http://fullpath/image_animation.gif');
},function() {
$(this).attr('src','http://fullpath/image.gif');
}
});
Αnimation Gif στην κατάσταση "Hover"
Ευχαριστώ
Μέλη σε σύνδεση
Μέλη σε αυτήν τη Δ. Συζήτηση: Δεν υπάρχουν εγγεγραμμένα μέλη και 2 επισκέπτες