begin process at 2012 05 29 01:42:22
  Trouver un code source :
 
dans
 
[ Dernières recherches ]
Accueil > Forum > 

Javascript / DHTML / Ajax

 > 

JavaScript Orienté objet (POO)

 > 

Function & Méthodes

 > 

Aidez moi pour ce code sources svp !!!

Derniers messages déposésPoser une question dans le forum ou lancer une discussion

Aidez moi pour ce code sources svp !!!

mardi 17 octobre 2006 à 05:22:09 | Aidez moi pour ce code sources svp !!!

masta64
salut a tous !!! Pourriez vous m'aidez à bien faire mon code source pour ma fonction que je cherche ,c'est a dire, une image qui apparait au premier plan avec "onMouseOver" et qui disparait en laissant place au texte avec "onMouseOut" !!!

Ce qui suit c'est le code HTML de la page qui m'interesse !!!
  1. <HTML><head>
  2. <meta name="generator" content="HTML Tidy for Windows (vers 1 June 2005), see  www.w3.org">
  3. <title>Mon site</title>
  4. <meta name="Author" content="">
  5. <script_language="JavaScript" src="/fichiers/source.js" type="text/javascript">
  6. </script>
  7. <link rel="SHORTCUT ICON" href="http://www.masta64.neuf.fr/favicon.ico">
  8. <script language="JavaScript" src="/fichiers/niouzes.js" type="text/javascript">
  9. </script>
  10. <style type="text/css">
  11. BODY {      SCROLLBAR-FACE-COLOR: #1F1F1F;    SCROLLBAR-HIGHLIGHT-COLOR: #C9C9C9;      SCROLLBAR-SHADOW-COLOR: #000000;      SCROLLBAR-3DLIGHT-COLOR: #A0A0A0;      SCROLLBAR-ARROW-COLOR: #C9C9C9;      SCROLLBAR-TRACK-COLOR: #FFFFFF;      SCROLLBAR-DARKSHADOW-COLOR: #1F1F1F      }      #TXT {      position: relative;      z-index: 2;      }      #TXT-OVER {      position: relative;      z-index: 2;      }      #TXT P {      COLOR: #CCCCCC;      TEXT-ALIGN: justify;      font-family: Verdana, Tahoma, Arial;      text-decoration: none;      font-size: 8pt;      text-indent: 20px;      position: relative;      z-index: 2;      }      #TXT-OVER P {      COLOR: #000000;      TEXT-ALIGN: justify;      font-family: Verdana, Tahoma, Arial;      text-decoration: none;      font-size: 8pt;      text-indent: 20px;      position: relative;      z-index: 2;      }      #TXT A {      COLOR: #CCCCCC;      TEXT-ALIGN: justify;      font-family: Verdana, Tahoma, Arial;      text-decoration: bold;      font-size: 8pt;      }      #TXT-OVER A {      COLOR: #000000;      TEXT-ALIGN: justify;      font-family: Verdana, Tahoma, Arial;      text-decoration: bodl;      font-size: 8pt;      }      P {      color: #1F1F1F;      font-family: Verdana, Tahoma, Arial;      text-decoration: none;      font-size: 8pt;      text-align: justify;      }      P.r {      color: #000000;      text-align: right;      font-family: Verdana, Tahoma, Arial;      font-size: 8pt;      }      A {      color: #1F1F1F;      font-family: Verdana, Tahoma, Arial;      text-decoration: none;      font-size: 8pt;      }      A:Active {      color: #000000;      font-family: Verdana, Tahoma, Arial;      text-decoration: none;      font-size: 8pt;      }      A:Visited {      color: #1F1F1F;      font-family: Verdana, Tahoma, Arial;      text-decoration: none;      font-size: 8pt;      }      A:Hover {      color: #1F1F1F;      font-family: Verdana, Tahoma, Arial;      text-decoration: underline;      font-size: 8pt;      }      TD {      color: #1F1F1F;      font-family: Verdana, Tahoma, Arial;      text-decoration: none;      font-size: 8pt;      }      TD.N {      color: #1F1F1F;      text-align: center;      font-family: Verdana, Tahoma, Arial;      text-decoration: none;      font-size: 8pt;      }      H2 {      color: #A07F6F;      font-size: 10pt;      font-weight: bold;      font-family: Verdana, Tahoma, Arial;      text-align: justify;      }      INPUT {      color: #1F1F1F;      font-family: Verdana, Tahoma, Arial;      text-decoration: none;      font-size: 8pt;      text-align: justify;      }      SELECT {      color: #1F1F1F;      font-family: Verdana, Tahoma, Arial;      text-decoration: none;      font-size: 8pt;      text-align: justify;      }
  12. </style>
  13. <script language="JavaScript" type="text/javascript">
  14. function toggleVisibility(name,display) {
  15. tmp=document.getElementById(name);
  16. tmp.style.display=display;
  17. }
  18. function txtVisibility(name) {
  19. tmp=document.getElementById(name);
  20. tmp.id = 'TXT-OVER';
  21. }
  22. </script>
  23. <link type="text/css" rel="stylesheet" id="webdeveloper-show-comm         a href="/fichiers/show_comments.css">
  24. <style type="text/css" id="webdeveloper-show-comments-tooltips">
  25. div.webdeveloper-comment-icon,div.webdeveloper-comment-text, div.webdeveloper-comment-text * {background-color: #ffff99 !important;border-color: #ffcc66 !important;color: #000000 !important;  -moz-opacity: 0.9 !important; opacity: 0.9 !important;
  26. }
  27. </style>
  28. <link type="text/css" rel="stylesheet" id="webdeveloper-display-access-keys"  href="fichiers/tooltips.css">
  29. <style type="text/css" id="webdeveloper-display-access-keys-tooltips">
  30.       span.webdeveloper-access-key {      background-color: #ffff99 !important;      border-color: #ffcc66 !important;      color: #000000 !important;      -moz-opacity: 0.9 !important;      opacity: 0.9 !important;      }
  31. </style>
  32.     <link type="text/css" rel="stylesheet" id=
  33.     "webdeveloper-display-id-class-details" href=
  34.     "fichiers/tooltips.css">
  35. <style type="text/css" id="webdeveloper-display-id-class-details-tooltips">
  36.       span.webdeveloper-id-class-details {      background-color: #ffff99 !important;      border-color: #ffcc66 !important;      color: #000000 !important;      -moz-opacity: 0.9 !important;      opacity: 0.9 !important;      }
  37. </style>
  38.     <link type="text/css" rel="stylesheet" id=
  39.     "webdeveloper-display-object-information" href=
  40.     "fichiers/display_object_information.css">
  41. <style type="text/css" id="webdeveloper-display-object-information-tooltips">
  42.       div.webdeveloper-object-information {      background-color: #ffff99 !important;      border-color: #ffcc66 !important;      color: #000000 !important;      -moz-opacity: 0.9 !important;      opacity: 0.9 !important;      }
  43. </style>
  44.     <link type="text/css" rel="stylesheet" id=
  45.     "webdeveloper-display-stack-levels" href=
  46.     "fichiers/tooltips.css">
  47. <style type="text/css" id="webdeveloper-display-stack-levels-tooltips">
  48.       span.webdeveloper-stack-level {      background-color: #ffff99 !important;      border-color: #ffcc66 !important;      color: #000000 !important;      -moz-opacity: 0.9 !important;      opacity: 0.9 !important;      }
  49. </style>
  50.     <link type="text/css" rel="stylesheet" id="webdeveloper-display-tab-index"
  51.     href=
  52.     "fichiers/tooltips.css">
  53. <style type="text/css" id="webdeveloper-display-tab-index-tooltips">
  54.       span.webdeveloper-tab-index {      background-color: #ffff99 !important;      border-color: #ffcc66 !important;      color: #000000 !important;      -moz-opacity: 0.9 !important;      opacity: 0.9 !important;      }
  55. </style>
  56. </head>
  57. <body class="P" topmargin="0" bgcolor="white">
  58. <span class="webdeveloper-id-class-details">#LOGO-OFF</span> <img id="LOGO-OFF" src="fichiers/logo-tolkiendil2.jpg"style="position: absolute; z-index: 1; left: 50%; top: 180px; width: 400px; height: 320px;margin-left: -200px;">
  59. <span class="webdeveloper-stack-level">img #LOGO-OFF Z-index=1</span>
  60. <span class="webdeveloper-id-class-details">#LOGO-ON</span> <img id="LOGO-ON" src="fichiers/logo-tolkiendil1.gif"style="position: absolute; z-index: 3; left: 50%; top: 180px; width: 400px; height: 320px; margin-left: -200px; display: inline;"onmouseover=
  61. "javascript: toggleVisibility('LOGO-ON','none'); txtVisibility('TXT');">
  62. <span class="webdeveloper-stack-level">img #LOGO-ON Z-index=3</span>
  63. <table align="center" border="0" cellpadding="0" cellspacing="0" height="100%" width="100%">
  64. <tbody>
  65. <tr>
  66. <td align="center">
  67. <a href="http://www.masta64.neuf.fr/index.php"><img src=
  68. "fichiers/bandeau_tolkiendil.jpg" border="0" height="90" width="482">
  69. </a>
  70. </td>
  71. </tr>
  72. <tr>
  73. <td align="center">
  74. <a href="http://www. masta64.neuf.fr/index.php"><img src="fichiers/association.jpg"
  75.  alt="" title="" onmouseover="javascript: src='images/association_o.jpg';" onmouseout=
  76.  "javascript: src='images/association.jpg';" border="0" height="30"
  77.   width="200"></a><br>
  78.  <br>
  79. </td>
  80.  </tr>
  81. <tr>
  82.  <td>
  83. <table align="center" border="0" cellpadding="0" cellspacing="0" height="100%" width="100%">
  84. <tbody>
  85. <tr>
  86. <td align="center" valign="middle">                   
  87. </td>
  88. <td rowspan="5" align="center" valign="middle" width="650">
  89. <a href="http://www.masta64.neuf.fr/accueil.php">
  90. <!--img src="images/dragon.jpg" width="250" height="250" alt="" border="0" TITLE="Page d'accueil"--></a>
  91. <!--<TABLE BORDER="0" CELLPADDING="0" CELLSPACING="1" BGCOLOR="#000000" WIDTH="100%"><TR><TD>-->
  92. <center>
  93. <span class="webdeveloper-id-class-details">#TXT</span>
  94. <table bgcolor="white" border="0" cellpadding="10"
  95.  cellspacing="0" width="100%">
  96. <tbody>
  97. <tr>
  98. <td id="TXT" onmouseover=
  99. "javascript: toggleVisibility('LOGO-ON','none'); id='TXT-OVER';"
  100. onmouseout=
  101. "javascript: toggleVisibility('LOGO-ON','inline'); id='TXT';">
  102. <span class="webdeveloper-stack-level">td #TXT
  103.  Z-index=2</span>
  104. <p>
  105. <span class="webdeveloper-stack-level">p
  106. Z-index=2</span> Bienvenue sur le site de
  107. <a href="http://www.tolkiendil.com/asso"><b>Tolkiendil,Association Loi 1901 pour la promotion de l'oeuvre de J.R.R. Tolkien</b></a>.
  108. </p>
  109. <p>
  110. <span class="webdeveloper-stack-level">p
  111. Z-index=2</span><a href="http://www.tolkiendil.com/homme/hombio.php"><b>J.R.R. Tolkien</b></a> est un auteur britannique du vingtième siècle, devenu une référence du genre imaginaire grâce à son livre
  112. <a href="http://www.tolkiendil.com/homme/fiches/sda.php">
  113. <b><i>Le Seigneur des Anneaux</i></b></a> qui
  114. faisait suite à <a href="http://www.tolkiendil.com/homme/fiches/bh.php">
  115. <b><i>Bilbo le Hobbit</i></b></a>. Après samort, son fils fit publier ses notes décrivant son immense univers dans divers autres ouvragesnotamment <a href="http://www.tolkiendil.com/homme/fiches/silm.php">
  116. <b><i>le Silmarillion</i></b></a>.
  117. </p>
  118. <p>
  119. <span class="webdeveloper-stack-level">p
  120. Z-index=2</span> L'association Tolkiendil vous propose d'explorer cet univers en participant à diverses activités comme l'organisation de
  121. <b>rencontre</b>, la participation à <b>des salons</b>, des discussions sur <a href= "http://www.tolkiendil.com/chat"><b>le chat</b></a> ou <a href=
  122. "http://forum.tolkiendil.com/" target="_blank"><b>le forum</b></a>, <a href=
  123. "http://www.yrch.com/" target="_blank"><b>l'annuaire de sites Yrch!</b></a>
  124. ainsi que <a href="http://www.tolkiendil.com/accueil.php"><b>son site</b></a>.
  125. </p>
  126. <p>
  127. <span class="webdeveloper-stack-level">p
  128. Z-index=2</span> Vous pourrez découvrir l'histoire de cet auteur et tout son travail dans la section détaillant <a href="http://www.tolkiendil.com/homme/hombio.php"><b>sa biographie</b></a> et <a href="http://www.tolkiendil.com/homme/hombiblio_tolk.php"><b>sa bibliographie</b></a>. Vous pourrez aussi savoir où et comment trouver des <a href="http://www.tolkiendil.com/homme/hombiblio_sur.php">
  129. <b>travaux publiés</b></a> déjà réalisés surson oeuvre ou simplement consulter les <a href="http://www.tolkiendil.com/essais"><b>essais et études</b></a> que nous publions.
  130. </p>
  131. <p>
  132. <span class="webdeveloper-stack-level">p
  133. Z-index=2</span> Pour mieux explorer ce monde,vous trouverez une <a href="http://www.tolkiendil.com/encyclo"><b>encyclopédie</b></a>
  134. accompagnée d' <a href="http://www.tolkiendil.com/encyclo/chrono.php"><b>une chronologie</b></a> vous permettant de resituer dans le temps tout évènement. De plus,<a href="http://www.tolkiendil.com/langues"><b>la section Langues</b></a> vous fera aborder les langues des nombreux peuples.
  135. </p>
  136. <p>
  137. <span class="webdeveloper-stack-level">p
  138. Z-index=2</span> Savourez les oeuvres artistiques inspirées de l'univers du
  139. professeur, aussi bien au niveau des
  140. <a href="http://www.tolkiendil.com/galerie"><b>arts graphiques exposés dans la Galerie</b></a>, que des <a href="http://www.tolkiendil.com/arts"><b>arts
  141. littéraires réunis dans la section Arts</b></a>. Les sections <a href=
  142. "http://www.tolkiendil.com/humour"><b>Humour</b></a>
  143. et <a href="http://www.tolkiendil.com/telec"><b>Téléchargement</b></a>
  144. vous permettront d'apprendre et de partager votre passion notamment en s'amusant.
  145. </p>
  146. <p>
  147. <span class="webdeveloper-stack-level">p
  148. Z-index=2</span> Découvrez et partagez avec l'
  149. <a href="http://www.tolkiendil.com/asso"><b>Association Tolkiendil</b></a>, l'immensité de l'oeuvre de J.R.R. Tolkien. Apprenez qui est Aragorn et Arwen, Elrond et Galadriel, Gandalf et Saroumane. Soyez émus par l'histoire Túrin Turambar, soyez charmés par celle de Beren et Lúthien, révoltés par celle de Fëanor. Comprenez la génèse d'un univers magique.
  150. <b>Imaginez cette mythologie comme la vôtre ! Rêvez tout simplement...</b>
  151. </p>
  152. </td>
  153. </tr>
  154. </tbody>
  155. </table>
  156. </center><!--</TR></TD></TABLE>-->
  157. </td>
  158. </tr>
  159. <tr>
  160. <td></td>
  161.                 </tr>
  162.                 <tr>
  163.                   <td></td>
  164.                 </tr>
  165.                 <tr>
  166.                   <td align="center" valign="middle">
  167.                      
  168.                   </td>
  169.                   <td align="center" valign="middle"></td>
  170.                 </tr>
  171.                 <tr>
  172.                   <td align="center" height="100%" valign="middle">
  173.                      
  174.                   </td>
  175.                 </tr>
  176.               </tbody>
  177.             </table>
  178.           </td>
  179.         </tr>
  180.         <tr>
  181.           <td align="center">
  182.             <br>
  183.             <table width="100%">
  184.               <tbody>
  185.                 <tr>
  186.                   <td align="center" width="33%">
  187.                      
  188.                   </td>
  189.                   <td align="center" width="33%">
  190.                      
  191.                   </td>
  192.                   <td align="center" width="33%">
  193.                      
  194.                   </td>
  195.                 </tr>
  196.               </tbody>
  197.             </table>
  198.           </td>
  199.         </tr>
  200.         <tr>
  201.           <td colspan="3" align="center">
  202.             <br>
  203.             <br>
  204.             <table bgcolor="#FE0232" border="0" cellpadding="0" cellspacing="1"
  205.             width="650">
  206.               <tbody>
  207.                 <tr>
  208.                   <td>
  209.                      
  210.                   </td>
  211.                 </tr>
  212.               </tbody>
  213.             </table><br>
  214.           </td>
  215.       </table>
  216.   </body>
  217. </html>
  218. masta64


Voila ca c'est la page d'accueil du site tolkien.com un peu degrossi à ma facon et ce que j'ai selectionné en rouge c'est ce que je crois kil faut que je garde pour ma fonction d'image qui vient au premier plan avec "onMouseOver" et qui fait apparaitre le texte avec "onMouseOut", et dans le reste je sais pas trop ce qui est important à garder pour ce que je veux faire !!! Je sais j'ai pier la page du site tolkien.com !!!


Montrez moi ce qui est important à garder dans cette page, que j'aurais oublier !!!
Si vous avez aussi besoin du code source du fichier "source.js", dite le moi je le mettrais !!!
Merci d'avance

masta64
mardi 17 octobre 2006 à 14:07:54 | Re : Aidez moi pour ce code sources svp !!!

bultez

Membre Club




Bonjour,

   si tu veux qu'on t'aide, et il n'y a pas de raison qu'on
   ne le fasse pas, exposes ton problème, ce que tu veux
   faire..., donnes nous le script qui ne fonctionne pas 
   ==> les réponses ne devraient pas manquer.

   et pourquoi autant de messages ? ça indispose...

            Cordialement    Bul    [mon Site]    [M'écrire]
mardi 17 octobre 2006 à 18:25:36 | Re : Aidez moi pour ce code sources svp !!!

PetoleTeam

Membre Club


B onjour...

Ce qu'il faut garder ???
...les STYLEs, c'est ce qui fait l'effet, surtout ceux attribués à
#TXT
#TXT-OVER
...le SCRIPT, c'est ce qui fait l'effet
...les IMAGES, c'est ce qui fait l'effet, et surtout au moins deux
<IMG ID="LOGO-OFF" ...etc...
<IMG ID="LOGO-ON" ...etc...
...la Table du message, sans elle pas d'effet...
<TABLE BORDER="0" CELLPADDING="10" CELLSPACING="0" BGCOLOR="#FFFFFF" WIDTH="100"><TR>
  <TD ID="TXT"  onMouseOver="javascript: toggleVisibility('LOGO-ON','none'); id='TXT-OVER';" onMouseOut="javascript: toggleVisibility('LOGO-ON','inline'); id='TXT';">
..la tu mets ce que tu veux
  </TD>
</TR></TABLE>

Le principe ??
couche 1 -> IMAGE du DESSOUS
couche 2 -> le TEXTE a afficher en gris clair
couche 3 -> IMAGE du DESSUS transparente

Quand on passe la mouse sur IMAGE du DESSUS elle se cache et on change le style du TEXTE, en STYLE TXT-OVER,
la couche 2 devient celle du DESSUS

Quand on quitte la mouse de la couche de DESSUS on ré affiche l'IMAGE de DESSUS et on change le style du TEXTE.
 
Attention l'IMAGE du DESSOUS est cachée par l'IMAGE du DESSUS, c'est la même plus Fade en fait

 ;0)


Cette discussion est classée dans : text, font, index, important, color

Répondre à ce message

Sujets en rapport avec ce message

Design photoshop est menu java [ par chris_v15 ] voila,je vient tout juste de creer mon web design avec photoshop est j'ai reservé un bouton pour quand passant le curseur desus un menu y apparait j'a Déroulement menu css et javascript [ par kristale ] Hello! j'ai un petit soucis avec mon menu déroulant. J'aimerai que les sous menus ne disparaissent pas quand on clique dessus, mais qu'ils restent.Et integrer image arriere plan dans menu CSS [ par ju0123456789 ] Bonjour,je viens de mettre en place un menu avec sous menu, et mon probleme est que je voudrais integrer une image d'arriere plan, mais soit ce n'est  Regroupement de plusieurs pages htm en une seule [ par vhalter ] Bonjour à tous,J'ai créé un site web pour la vente de ma maison.J'ai crée aussi une page pour une visite virtuelle. http://maison08.free.fr/Menu/fr-vi Lien et checkbox [ par imen99 ] Hi J'ai ce code et je veux ajouter des checkbox devant chaque lien et que les liens ne fonctionne qu'aprés avoir séléctionner un checkbox et PB de cohésion entre un fond et son interface, ne s'alignent pas de la même façon. [ par chabgyver ] Bonsoir,J'ai décidé de refaire le design de mon site : http://balistiq.frJ'ai intégrer un design dans un template en php, ça n'a pas été simple mais j Curseur de la souris sur un bouton. [ par overstorex ] Bonsoir, j'aurai voulu savoir si il est possible si le curseur de la souris ce trouve sur le bouton celui-ci change de couleur ? Conflit OnMouseOut et OnClick [ par rehtakulveets ] Bonjour à tous. Je sais que le sujet a déjà été traité mais mon problème est un peu différent et je n'arrive pas à m'en sortir. J'ai récupéré un code Impression:centrer le tablau au milieu de la page [ par chezeu ] Bonsoir, j'ai un probléme. C'est le suivant : j'ai ma page web dans laquelle il y a un tableau et un bouton "Imprimer". Lorsque j'imprimer il laisse u Problème d'exécution d'un script vbs/javascript [ par cedren ] Bonjour,Tout d'abord je suis débuttant en développement.Ma direction me demande de créer une popup qui se lancerait au démarrage de windows sur chaque


Nos sponsors


Sondage...

CalendriCode

Mai 2012
LMMJVSD
 123456
78910111213
14151617181920
21222324252627
28293031   

Consulter la suite du CalendriCode

A découvrir
 
Développement réalisé par Nicolas SOREL (Nix) avec l'aide de : Cyril DURAND et Emmanuel (EBArtSoft), Merci à Vincent pour ses précieux conseils.
CodeS-SourceS.com© Toute reproduction même partielle est interdite sauf accord écrit du Webmaster
CodeS-SourceS.com© est une marque déposée tous droits réservés

Google Coop CodeS-SourceS Google Coop CodeS-SourceS
Temps d'éxécution de la page : 1,061 sec (4)

Nous contacter | Annoncer sur CodeS-SourceS | Mentions légales
Outils Convertisseur VB/C# Snippets et scripts Outils en ligne La ToolBox
Communauté Programmation Photographie Technologie Newsgroups Emploi Forum Blogs
Guide d'achat Téléphonie mobile Image et son Informatique Bureautique Jeux vidéo
Logiciels Internet & Réseau Développement Market Android Jeux & Loisirs Graphisme Multimédia Sécurité Pilotes
Loisirs Cartes virtuelles Vidéos droles Jeux en ligne Géoguide AndroLib (Android Market)