[js] apertura finestra dialogo al passaggio del mouse

**NoWhere** · 27-08-2006, 12.01.31

qualcuno sa dirmi che scirpt o file.js utilizzare per far si che al passaggio del mouse sopra un link si apra una finestra di dialogo a mò di box??

e anche che script o file.js utilizzare per far si che si apra una finestra in rilievo nella pagina al click del mouse??

per entrambi gli esempi tentati di descrivere sopra, vi riporto a questo sito:
http://www.planetfrag.it/ogame/

esempio 1) passate il mouse sopra >>?<<
esempio 2) cliccate nell'img [^] - ve ne sono solo 2

io ho provato a vedere il file.js, ma non scrivo in js quindi a poco mi é servito..
ho provato anche a tentare di capire il codice della pagina, ma dopo qualche tentativo spartano a me non funziona -_-'
Se qualcuno può aiutarmi...

**mythologia** · 27-08-2006, 12.22.43

Per il primo ho trovato questo su google:
http://www.walterzorn.com/tooltip/to...e.htm#download (è lo stesso utilizzato in quel sito)

Per il secondo, utilizza un semplicissimo file.js contenente:

Codice HTML:

function WindowOpen(id2) {

	document.getElementById(id2).style.visibility = "visible";
}

function closeMessage(id2) {
	document.getElementById(id2).style.visibility = "hidden";
}

E nella pagina ha (preso dal sito linkato)

Codice HTML:

<div id="forum" style="padding: 5px; visibility: hidden; position: absolute; width: 273px; height: 103px; top: 190px; left: 230px; overflow: auto; background-color: rgb(17, 17, 17);">
<table  width="100%" border="0" cellpadding="4" cellspacing="1" align="center" class="forumline">
<tr>

 <td colspan="2" class="row3"><b><span class="gensmall">Specifica la TAG supportata dal forum.<br />
 - <span class="yell">Ogame Forum</span> » [CENTER] <br />
 - <span class="yell"> PhpBB Plus / PhpBB + Mod</span> » [align=center]</span></b></td>

</tr>
<tr>
 <td class="row2">
 <select name="center_type">
 <option value="a">Ogame Forum</option>
            <option value="b">PhpBB Plus / PhpBB + Mod</option>   </select>
 </td>
</tr>
 <tr>

 <td align="center" colspan="2"><input type="button" value="Chiudi" onclick="closeMessage('forum');" class="mainoption"/></td>
</tr>
</table>
</div>
<a href="#" onclick="WindowOpen('forum');"> <img src="urlimg.ext" alt="" border="0"/></a>

Quindi spiegando, il js copialo ed incollalo mentre per l'html fai così:
crei un div assegnandogli visibilità hidden e dandogli un id, all'interno metti ciò che vuoi esca quando si clicca sulla parola/immagine che metterai come link (proprio come nel sito avviene clikkando sulle immagini), poi nel link metti che al click WindowOpen('idassegnatoaldiv');...
in pratica

Codice HTML:

//crei il div assegnandogli visibilità hidden e dandogli un id (in questo caso ho dato nomechevuoi
<div id="nomechevuoi" style="visibility: hidden;">
//ciò che apparirà clikkando dovrà stare in questo div
Funziona!!
</div>
//crei il link per rendere visibile la parte che per ora è nascosta (il div)
<a href="#" onclick="WindowOpen('nomechevuoi');">Clikka</a>

Spero di essere stato chiaro

27-08-2006, 12.22.55

La proprietà di <a href> necessaria per fare qualcosa al passaggio del mouse è onMouseOver, e va usata così

Codice HTML:

<a href="#" onMouseOver="alert('Hai messo il mouse sul testo.');">Testo</a>

Intento puoi provare a lavorare su questo, se non sbaglio su HTML.it c'era una guida per creare finestrelle come quelle, che si chiamanl tooltip box.

**NoWhere** · 27-08-2006, 12.55.08

grazie!!
ora testo e vedo se funonzia anche ammmè!! ^__^

edit: testato, funziona alla grande!!
unica nota: bisogna ricordarsi si non omettere fra i tag <head></head> il richiamo al file.js

Codice:

<script language="JavaScript" type="text/javascript" src="file.js"></script>

Discussione: [js] apertura finestra dialogo al passaggio del mouse

LinkBack

Strumenti discussione

Display

[js] apertura finestra dialogo al passaggio del mouse

Regole di scrittura