Forum |  HardWare.fr | News | Articles | PC | S'identifier | S'inscrire | Shop Recherche
3205 connectés 

  FORUM HardWare.fr
  Programmation

  [html - javascript-...]

 



 Mot :   Pseudo :  
 
Bas de page
Auteur Sujet :

[html - javascript-...]

n°118840
kvl
Posté le 28-03-2002 à 20:14:27  profilanswer
 

J'ai vu des "tags ou tool tip text" hyper beau pas jaunatres !!!... J'essaye de trouver comment faire ... Peut etre avec un css ...  
Un petit lien pour vous montrer de quoi il retourne ...  
C le type de tag présent sur la tool bar ou il y a les persos de Bd ...
http://www.a1javascripts.com/  
 
Si vous savez avec quoi c fait javascript, css, java, vbs ...  
Si vous avez un modele du script c encore plus top  :ange:

mood
Publicité
Posté le 28-03-2002 à 20:14:27  profilanswer
 

n°118842
skylight
Made in France.
Posté le 28-03-2002 à 20:20:43  profilanswer
 

un ptit <div></div> :)

n°118898
kvl
Posté le 29-03-2002 à 01:18:41  profilanswer
 

Merci d'avoir essayer  :sarcastic:  
 
un tool tip text c http://kvl.itgo.com/tag2.gif
 
et en html il faut faire <img src="..." tag="Mon petit msg">
 
et je voudrais faire http://kvl.itgo.com/tag.gif
 
Merci de votre aide ...

 

[jfdsdjhfuetppo]--Message édité par kvl--[/jfdsdjhfuetppo]

n°118899
youdontcar​e
Posté le 29-03-2002 à 01:57:44  profilanswer
 

pour du html / js, tu peux bien te débrouiller en cherchant un minimum. tu prends le html, t'enlèves des trucs jusqu'à ce que ça marche plus, tu remets (undo) le dernier truc que tu as enlevé. tu fais ça sur toute la source, par bouts de 40 lignes par ex.
 
//
 
pour ton problème :
 
c'est un élément html (un div, un span, n'importe quoi) en position absolue. il est nommé pour qu'il puisse être manipulé.
 
<div id='toolTip' style='position: absolute'>mon texte tooltip</div>
 
maintenant, il faut deux choses :
 
1) par défaut, le cacher. le rendre visible lorsqu'il passe sur l'élément qui le génère, le rendre invisible lorsqu'il quitte l'élément.
 
2) lui faire suivre les coordonnées de la souris lorsque le curseur passe sur l'élément qui génère le tooltip.
 
pour le 1), on utilise les événement onmouseover et onmouseout de l'élément qui génère le tooltip pour l'afficher / le masquer.  
onmouseover="toolTip.style.visibility = 'visible'";
onmouseout="toolTip.style.visibility = 'hidden'";
 
pour le 2), on utilise l'événement mousemove qui reçoit en paramètre les coords de la souris.
onmousemove="updateToolTip()"
 
function updateToolTip()
{
  toolTip.style.left = event.x;
  toolTip.style.top = event.y;
}
 
//
 
dans ton exemple, ton tooltip a l'air d'être une table. on n'utilise donc pas un <div> mais une <table>, qui contient deux éléments modifiables : le titre et le contenu.
 
<table id='toolTip' width='200' style='position: absolute; visibility: hidden; background-color: rgb(255, 0, 0)'>
<tr><td id='toolTipTitle' style='background-color: rgb(0, 255, 0)'></td></tr>
<tr><td id='toolTipBody'></td></tr>
</table>
 
sur chaque icône :
 
<img src='....tonimage.jpeg'  
onmouseover="showToolTip('titre de cette icône', 'contenu de cette icône';)"
onmouseout="hideToolTip()"
onmousemove="updateToolTip()"
>
 
<script>
  function showToolTip(t, b)
  {
    toolTipTitle.innerHTML = t;
    toolTipBody.innerHTML = b;
    toolTip.style.visibility = 'visible';
    toolTip.style.left = event.x;
    toolTip.style.top = event.y;
  }
 
  function hideToolTip()
  {
    toolTip.style.visibility = 'hidden';
  }
 
  function updateToolTip()
  {
    toolTip.style.left = event.x;
    toolTip.style.top = event.y;
  }
</script>
 
//
 
ça marchera sous ie. pour netscape, tu remplaces les affectations directes par un document.getElementById() :
 
au lieu de  
 
  toolTip.style.left = event.x;
 
c'est
 
  document.getElementById('toolTip';).style.left = event.x;
 
il faut également capturer les événements souris, je ne me souviens plus de la syntaxe.

 

[jfdsdjhfuetppo]--Message édité par youdontcare--[/jfdsdjhfuetppo]

n°118945
gwen2709
Posté le 29-03-2002 à 09:53:09  profilanswer
 

ceam a écrit a écrit :

le script d'origine
http://www.bosrup.com/web/overlib/  




 
exactement...c bien cool d'ailleurs!

n°119028
kvl
Posté le 29-03-2002 à 12:20:51  profilanswer
 

Merci à tous  :love:


Aller à :
Ajouter une réponse
  FORUM HardWare.fr
  Programmation

  [html - javascript-...]

 

Sujets relatifs
[Javascript, Formulaire HTML] champs INPUT disabled n'apparaissent pas[HTML / Javascript] ne rien selectionner dans une scrolling list
[php/javascript/html]Passage de la valeur d'une liste de selection[HTML ou JavaScript ou autre] Lancer une applicaton
[HTML/JAVASCRIPT] Obligé de faire un href # pour un onclick ???[HTML JAVASCRIPT] Problème de cookies
Aide en html et javascript svp !![JAVASCRIPT] transfert de parametre et exction dune propriete html ...
[HTML, javascript] je vais hurler !!!!!!!!!!!!!!!!!!!!!!!!!!!!!! !!!![HTML ou JAVASCRIPT] onmouseover et label...
Plus de sujets relatifs à : [html - javascript-...]


Copyright © 1997-2022 Hardware.fr SARL (Signaler un contenu illicite / Données personnelles) / Groupe LDLC / Shop HFR