Tout le monde connaît les effets de navigation généraux, tels que l'utilisation de CSS pour configurer, souligner, couleur d'arrière-plan ou déplacer le texte de navigation. Dans le post précédent, certains internautes ont mentionné le site http://www.tonta.com.cn/ , et j'ai trouvé que l'effet de navigation sur sa page d'accueil est bon. Bien que le flash n'ait pas un effet très éblouissant, il l'est relativement. délicat et a l'air très confortable.
Je n'ai rien à faire et j'essaie d'obtenir le même effet de navigation dans dw. L'effet est le suivant : http://vip.5d.cn/flood/daohang/1.htm .
Tout d'abord, analysez la composition de l'effet. Lorsque la souris passe dessus, l'arrière-plan change et la petite image pivote. D'accord! Pensez à utiliser l'image d'échange (image inversée) + le changement d'image d'arrière-plan (définition CSS) dans dw, ce qui devrait permettre d'obtenir l'effet.
Préparez 4 images GIF :
L'image de fond au passage de la souris (en FW, Nimate peut facilement réaliser l'effet dégradé. La transparence de cette image passe progressivement de 0% à 100%)
[img]/conimages/web/2003-06/bg0604.gif[/img]
L'image de fond lorsque la souris est tirée (la transparence de cette image passe progressivement de 100% à 0%)
[img]/conimages/web/2003-06/b0604.gif[/img]
petite image dynamique
[img]/conimages/web/2003-06/20604.gif[/img]
Petite image fixe (définissez le format d'image sur gif dans fw et enregistrez-la)
[img]/conimages/web/2003-06/2a0604.gif[/img]
1. L'effet d'arrière-plan est implémenté à l'aide de CSS pour définir deux classes :
.style1 { background-image: url(bg.gif)}
.style2 {background-image: url(b.gif)}
est utilisé pour l'image d'arrière-plan lorsque la souris passe dessus et lorsque la souris est retirée. Ajoutez ensuite le code suivant dans la cellule :
onmouseover="this.className='. style1'"
onmouseout="this.className='style2'"
peut obtenir l'effet du dégradé d'arrière-plan apparaissant lorsque la souris passe et disparaissant une fois la souris éloignée.
2. L'effet de retournement d'image vous permet d'insérer une petite image statique dans une cellule, d'utiliser un comportement pour ajouter un effet d'image d'échange et de la configurer pour qu'elle se transforme en une petite image dynamique après le passage de la souris dessus.
Afin d'obtenir un effet plus rapproché, vous devez appliquer l'effet de retournement d'image à la cellule et couper le code suivant dans le code de petite image statique :
onMouseOver="MM_swapImage('Image2','','2.GIF', 1)"
onMouseOut="MM_swapImgRestore()"
est collé dans la balise td du code de cellule.
Vous pouvez réaliser un retournement d'image lorsque la souris passe sur la cellule, produisant un effet dynamique.
À ce stade, tous les effets peuvent être obtenus.
Dans cet exemple, l'effet obtenu avec dw est presque comparable à l'effet produit par flash, voire même meilleur (nous avons obtenu l'effet de disparition du dégradé d'arrière-plan lorsque la souris dessine la cellule).
Section:
1. Créer soigneusement des images d'arrière-plan dégradées dans fw (je viens de créer deux images dégradées aléatoires) + modifier les cellules de navigation peut rendre l'effet plus délicat et exceptionnel ;
2. Lorsque vous utilisez cette méthode pour créer des effets de navigation, vous devez utiliser plusieurs cellules. Notez que l'effet d'échange ne peut pas être copié. Après avoir copié le code, vous devez modifier deux codes :
onMouseOver="MM_swapImage('Image3','','. 2.GIF',1)"
<img src="2a.gif" name="Image3" width="15" height="15" border="0" id="Image3">
Modifiez simplement le nom de l'image inversée avec une valeur différente.
3. Le contenu technique de cet exemple n'est pas très élevé ; et je ne suis pas très familier avec Flash, donc je ne sais pas lequel est le plus facile à utiliser, DW ou Flash, mais je le mentionne ici uniquement pour vous fournir un moyen de résoudre le problème.
4. La superposition de deux effets simples peut créer un effet plus cool. J'espère que cela pourra être éclairant pour tout le monde. Encore un point : lors de la création d'images d'arrière-plan animées, pour obtenir l'effet, vous devez définir la boucle de l'animation gif sur non. boucler (ne pas boucler)
:)