Forum Crea illusion Fantasy
A quoi sert le forum ?
Ce forum est liée à mon site Crea illusion Fantasy. Un plus pour vous aidez dans vos créations.Vous ne savez pas créer, et vous recherchez une création personnalisée. Le forum vous écoutera vos demandes.
Plusieurs sections :
Des aides: pour votre forum,votre site ou blog.Des tutoriels(photoshop,paintshop,gimp,photofiltre,ect...).Demandes de créations personnalisées. Aide pour prendre en main vos logiciels.Des tutos, des scripts. aides pour le logiciel Flash..... Des concours, des challenges, des duels. Vous y trouverez un accueil sympathique.
Au plaisir de vous lire sur le forum. D'autres choses à venir découvrir sur le forum de Créa illusion Fantasy.

N'hésitez pas à venir vous inscrire.


Aides - Codes - Conseils - Forum - Sites web - blogs - Tout supports - Photographies - Graphismes - Dessins - Peintures - Tutoriels - Publicités.
 
AccueilPortailÉvènementsFAQPublicationsPublicationsS'enregistrerConnexion
Votre bannière ici,Faite la demande dans la catégorie: La place Public


Partagez | .
 

 Menu Intéractif

Voir le sujet précédent Voir le sujet suivant Aller en bas 
AuteurMessage
Ptite_Perle
Admin


avatar


Messages : 6745
Venue : 27/06/2009 Je suis: : Féminin
Né(e) le : 17/09/1963
Age : 53
Je vie à : Lyon
Humeur : Bonne humeur
Mes Points : 8999

MessageSujet: Menu Intéractif   Sam 31 Juil 2010 - 23:18


Réalisez votre menu intéractif

Voir ici le menu intéractif


Il faudra mettre l'url de vos images, et les urls de vos liens à la place des miens

Voici le code, a mettre entre body et /body :

Code:
<style> img { border: none; } /* dock - top */ .dock { z-index: 111111111111111111; background-image: url(''); background-repeat: repeat-y position: relative; height: 50px; text-align: center; } .dock-container { position: absolute; height: 50px; background: url(); padding-left: 20px; } a.dock-item { display: block; width: 40px; color: #000; position: absolute; top: 0px; text-align: center; text-decoration: none; font: bold 12px Arial, Helvetica, sans-serif; } .dock-item img { border: none; margin: 5px 10px 0px; width: 100%; } .dock-item span { display: none; padding-left: 20px; } /* dock2 - bottom */ #dock2 { width: 100%; bottom: 0px; position: absolute; left: 0px; } .dock-container2 { position: absolute; height: 50px; background: url(images/dock-bg.gif); padding-left: 20px; } a.dock-item2 { display: block; font: bold 12px Arial, Helvetica, sans-serif; width: 40px; color: #000; bottom: 0px; position: absolute; text-align: center; text-decoration: none; } .dock-item2 span { display: none; padding-left: 20px; } .dock-item2 img { border: none; margin: 5px 10px 0px; width: 100%; } </style> <script type="text/javascript" src="http://sd-1.archive-host.com/membres/up/37297969143779149/jquery.js"></script> <script type="text/javascript" src="http://sd-1.archive-host.com/membres/up/37297969143779149/interface.js"></script> <!--[if lt IE 7]>  <style type="text/css">  div, img { behavior: url(iepngfix.htc) } </style> <![endif]--> <div class="dock" id="dock"> <div class="dock-container"> <a href="http://www.creaillusionfantasy.com/" target="_blank" class="dock-item"><img src="http://sd-4.archive-host.com/membres/up/99685358053205863/Caroussel/1.png" /> <span class="Style3">Accueil</span></a><a href="http://www.creaillusionfantasy.com/codexcrea.html" target="_blank" class="dock-item"><span><a href="http://www.creaillusionfantasy.com/codexcrea.html" target="_blank" class="dock-item"><img src="http://sd-4.archive-host.com/membres/up/99685358053205863/Caroussel/11.png"/><span class="Style3">Creations</span></span></a> <a href="http://forumcrea.forumactif.org/" target="_blank" class="dock-item"><img src="http://sd-4.archive-host.com/membres/up/99685358053205863/Caroussel/3.png" /> <span class="Style3">Forum</span></a><a class="dock-item" href="#"><img src="http://sd-4.archive-host.com/membres/up/99685358053205863/Caroussel/4.png" /> <span class="Style3">Sympa</span> </a> <a href="http://www.kazmag.com/" target="_blank" class="dock-item"><img src="http://sd-4.archive-host.com/membres/up/99685358053205863/Caroussel/5.png" /> <span class="Style3">KazMag</span> </a> <a href="http://www.creaillusionfantasy.com/" target="_blank" class="dock-item"><img src="http://sd-4.archive-host.com/membres/up/99685358053205863/Caroussel/6.png" /> <span class="Style3">A voir</span><a class="dock-item" href="#"><img src="http://sd-4.archive-host.com/membres/up/99685358053205863/Caroussel/8_2.png" /> <span class="Style3">Musique</span> </a> <a class="dock-item" href="#"><img src="http://sd-4.archive-host.com/membres/up/99685358053205863/Caroussel/7.png" /> <span class="Style3">Dossiers</span> </a> <a class="dock-item" href="#"><img src="http://sd-4.archive-host.com/membres/up/99685358053205863/Caroussel/12.png" /> <span class="Style3">CoolMenu</span> </a> <a class="dock-item" href="#"><img src="http://sd-4.archive-host.com/membres/up/99685358053205863/Caroussel/10.png" /> <span class="Style3">Nous ecrire</span>
    <span class="Style3">
    <script type="text/javascript"> </script>
    </span></a><span class="Style3">
    <script type="text/javascript">$(document).ready( function() { $('#dock').Fisheye( { maxWidth: 50, items: 'a', itemsText: 'span', container: '.dock-container', itemWidth: 40, proximity: 90, halign : 'center' } ) } ); </script>
Revenir en haut Aller en bas
http://www.creaillusionfantasy.com/
Capucine
Expert Adobe


avatar


Messages : 340
Venue : 11/11/2009 Je suis: : Féminin
Né(e) le : 06/11/1971
Age : 45
Je vie à : Auvergne : In Truffade we trust !
Humeur : bonne =)
Mes Points : 3090

MessageSujet: Re: Menu Intéractif   Dim 1 Aoû 2010 - 1:18

Haaaaaan la classouille !! Merci Perle =)
Revenir en haut Aller en bas
http://blog-adobegfx.com/wordpress/
Ptite_Perle
Admin


avatar


Messages : 6745
Venue : 27/06/2009 Je suis: : Féminin
Né(e) le : 17/09/1963
Age : 53
Je vie à : Lyon
Humeur : Bonne humeur
Mes Points : 8999

MessageSujet: Re: Menu Intéractif   Dim 1 Aoû 2010 - 10:01

De rien capucine Smile
Revenir en haut Aller en bas
http://www.creaillusionfantasy.com/
âme
inactif
avatar


Messages : 116
Venue : 28/01/2010 Je suis: : Féminin
Je vie à : Gard.
Humeur : Heureuse !
Mes Points : 240

MessageSujet: Re: Menu Intéractif   Ven 29 Oct 2010 - 23:58

Merci beaucoup ma 'tite Perle, ça sera très utile pour mon site perso !
Gros bisouxxxxxx
Revenir en haut Aller en bas
http://www.color-avenue.net/forum
Ptite_Perle
Admin


avatar


Messages : 6745
Venue : 27/06/2009 Je suis: : Féminin
Né(e) le : 17/09/1963
Age : 53
Je vie à : Lyon
Humeur : Bonne humeur
Mes Points : 8999

MessageSujet: Re: Menu Intéractif   Sam 30 Oct 2010 - 9:13

Je suis ravie, d'apprendre qu'il va être utile p our ton site, âme Smile
Revenir en haut Aller en bas
http://www.creaillusionfantasy.com/
âme
inactif
avatar


Messages : 116
Venue : 28/01/2010 Je suis: : Féminin
Je vie à : Gard.
Humeur : Heureuse !
Mes Points : 240

MessageSujet: Re: Menu Intéractif   Dim 31 Oct 2010 - 2:27

Il faudra que je regarde dans la semaine car je viens de le mettre en place et il doit y avoir une erreur dans le codage car ça ne fonctionne pas sur mon site et c'est pourtant placé entre "Body"
Je ferais un cop/col dans un fichier texte afin de mieux voir.
Bonne nuit et bon week-end ma 'tite Perle, bisouxxxx.
Revenir en haut Aller en bas
http://www.color-avenue.net/forum
Ptite_Perle
Admin


avatar


Messages : 6745
Venue : 27/06/2009 Je suis: : Féminin
Né(e) le : 17/09/1963
Age : 53
Je vie à : Lyon
Humeur : Bonne humeur
Mes Points : 8999

MessageSujet: Re: Menu Intéractif   Dim 31 Oct 2010 - 9:53

Oui surement quelques choses ne va pas, car sur la page que j'ai crée il fonctionne le menu

Je te met le code source de ma page, si ca peut aider, je te permet même de prend le code source

Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Menu intéractif</title>
<style type="text/css">
<!--
body {
   background-color: #492142;
}
.Style3 {font-size: 12px; color: #FFFFFF; }
.Style1 {color: #FFFFFF}
-->
</style>
</head>
<p>
<center class="Style1">Un joli menu intéractif <br /> Sur le menu quelques liens fonctionnent pour vous montrez les réactions </center>
 
<p>
 
 
 
<body><style> img { border: none; } /* dock - top */ .dock { z-index: 111111111111111111; background-image: url(''); background-repeat: repeat-y position: relative; height: 50px; text-align: center; } .dock-container { position: absolute; height: 50px; background: url(); padding-left: 20px; } a.dock-item { display: block; width: 40px; color: #000; position: absolute; top: 0px; text-align: center; text-decoration: none; font: bold 12px Arial, Helvetica, sans-serif; } .dock-item img { border: none; margin: 5px 10px 0px; width: 100%; } .dock-item span { display: none; padding-left: 20px; } /* dock2 - bottom */ #dock2 { width: 100%; bottom: 0px; position: absolute; left: 0px; } .dock-container2 { position: absolute; height: 50px; background: url(images/dock-bg.gif); padding-left: 20px; } a.dock-item2 { display: block; font: bold 12px Arial, Helvetica, sans-serif; width: 40px; color: #000; bottom: 0px; position: absolute; text-align: center; text-decoration: none; } .dock-item2 span { display: none; padding-left: 20px; } .dock-item2 img { border: none; margin: 5px 10px 0px; width: 100%; } </style> <script type="text/javascript" src="http://sd-1.archive-host.com/membres/up/37297969143779149/jquery.js"></script> <script type="text/javascript" src="http://sd-1.archive-host.com/membres/up/37297969143779149/interface.js"></script> <!--[if lt IE 7]>  <style type="text/css">  div, img { behavior: url(iepngfix.htc) } </style> <![endif]--> <div class="dock" id="dock"> <div class="dock-container"> <a href="http://www.creaillusionfantasy.com/" target="_blank" class="dock-item"><img src="http://sd-4.archive-host.com/membres/up/99685358053205863/Caroussel/1.png" /> <span class="Style3">Accueil</span></a><a href="http://www.creaillusionfantasy.com/codexcrea.html" target="_blank" class="dock-item"><span><a href="http://www.creaillusionfantasy.com/codexcrea.html" target="_blank" class="dock-item"><img src="http://sd-4.archive-host.com/membres/up/99685358053205863/Caroussel/11.png"/><span class="Style3">Creations</span></span></a> <a href="http://forumcrea.forumactif.org/" target="_blank" class="dock-item"><img src="http://sd-4.archive-host.com/membres/up/99685358053205863/Caroussel/3.png" /> <span class="Style3">Forum</span></a><a class="dock-item" href="#"><img src="http://sd-4.archive-host.com/membres/up/99685358053205863/Caroussel/4.png" /> <span class="Style3">Sympa</span> </a> <a href="http://www.kazmag.com/" target="_blank" class="dock-item"><img src="http://sd-4.archive-host.com/membres/up/99685358053205863/Caroussel/5.png" /> <span class="Style3">KazMag</span> </a> <a href="http://www.creaillusionfantasy.com/" target="_blank" class="dock-item"><img src="http://sd-4.archive-host.com/membres/up/99685358053205863/Caroussel/6.png" /> <span class="Style3">A voir</span><a class="dock-item" href="#"><img src="http://sd-4.archive-host.com/membres/up/99685358053205863/Caroussel/8_2.png" /> <span class="Style3">Musique</span> </a> <a class="dock-item" href="#"><img src="http://sd-4.archive-host.com/membres/up/99685358053205863/Caroussel/7.png" /> <span class="Style3">Dossiers</span> </a> <a class="dock-item" href="#"><img src="http://sd-4.archive-host.com/membres/up/99685358053205863/Caroussel/12.png" /> <span class="Style3">CoolMenu</span> </a> <a class="dock-item" href="#"><img src="http://sd-4.archive-host.com/membres/up/99685358053205863/Caroussel/10.png" /> <span class="Style3">Nous ecrire</span>
    <span class="Style3">
    <script type="text/javascript"> </script>
    </span></a><span class="Style3">
    <script type="text/javascript">$(document).ready( function() { $('#dock').Fisheye( { maxWidth: 50, items: 'a', itemsText: 'span', container: '.dock-container', itemWidth: 40, proximity: 90, halign : 'center' } ) } ); </script>
      </span></div>
</div>
<p> </p>
<p> </p>
<p> </p>
<p>&nbsp;</p>
<p align="center" class="Style1">Voila un joli menu pas trop difficile à réaliser avec un mininum de connaissance html</p>
<p align="center" class="Style1">Ptite_Perle</p>
</body>
</html>
Revenir en haut Aller en bas
http://www.creaillusionfantasy.com/
âme
inactif
avatar


Messages : 116
Venue : 28/01/2010 Je suis: : Féminin
Je vie à : Gard.
Humeur : Heureuse !
Mes Points : 240

MessageSujet: Re: Menu Intéractif   Dim 31 Oct 2010 - 14:52

Merci Ptite_Perle, je regarderais déjà ton codage de menu interactif et si je ne trouve pas je le montrerais à mon fils neomaster.
Au cas où, je repasserais ici voir ton code source mais rien ne presse de toute façon car avec le travail, je suis moins présente sur les fo' et le site Smile
Encore merci pour ta proposition !
Bisouxxxx et bon Dimanche.
Revenir en haut Aller en bas
http://www.color-avenue.net/forum
Contenu sponsorisé




MessageSujet: Re: Menu Intéractif   

Revenir en haut Aller en bas
 

Menu Intéractif

Voir le sujet précédent Voir le sujet suivant Revenir en haut 
Page 1 sur 1

 Sujets similaires

-
» [Permissions] Mettre les permissions dans le PA sous forme de tableau intéractif
» Intégrer un code HTML dans le menu vertical de la page d'accueil du forum ?
» Je souhaite insérer un Menu défilant sur toutes les pages du Forum
» Barre de menu flash : Comment intégrer du HTML au dessous le logo titre sur chaque pages?
» commande menu "Enregistrer"

Permission de ce forum:Vous ne pouvez pas répondre aux sujets dans ce forum
Forum Crea illusion Fantasy  :: Les bidules :: Gadgets-