Antworten auf deine Fragen:
Neues Thema erstellen

Antworten zum Thema „info mini popup“

phoenyx

Foren Vogel

Hi

ich brauche nen script das beim hovern eines bildes zusatzinformationen an der stelle des mauszeigers anzeigt (also sowas wie die alt funktion, aber halt nur sofort und nicht wenn man 3 sek mit dem mauszieger drauf war ...) ....
aber es müsste mit allen browsern kompatibel sein .... ich hab nämlich ein script benutzt und das auch angewandt ... hat mich ne morst arbeit gekostet das erst zu finden und dann auch noch bei allen bildern anzupassen :/ und jetzt merke ich das das script nicht mit IE kompatibel ist ...
Aber ich will ein script das nicht mit absolut oder so arbeitet ... ich glaube sowas muss es doch geben aber ich hab nix gefudnen wirklich !
evt hab ich nach dem falschen gesucht aber jetzt brauch ich eure hilfe ! am besten wenn man das mit CSS lösen kann ... Java script ist nicht so prickennd aber wenn nix anderes geht dann nehme ich auch das ....

danke danke danke jetzt schonmal !

lg phoenyx
 

Christian

verpeilt & verschallert

ja moment bitte ;)
is mit java+css,d.h. man kann in dem tooltip alle html tags verwenden
:
Code:
<html>
<head>
<style type="text/css">
.tooltip {
	position: absolute;
	display: none;
	font:10px Verdana;
    font-style:normal;  
    color: #cccccc;
    padding:2px 2px 2px 2px; 
    background-color:#336699; 
    border:1px solid #000000;
}

.tooltip .head{
    font-size: 10px;
	color: white;
	font-weight: bold;
	padding: 2px;
}
.tooltip .table{
    font-size: 9px;
    border-collapse: collapse;
	border: 1px dashed #000000;
}
</style>
<script language="JavaScript" type="text/javascript">
var xFromMouse = 10;
var yFromMouse = 10;

tip = null;
document.onmousemove = moveTip;

function moveTip(e) {
	x = (document.all) ? window.event.x + document.body.scrollLeft : e.pageX;
	y = (document.all) ? window.event.y + document.body.scrollTop  : e.pageY;
	if (tip != null) {
		tip.style.left = (x + xFromMouse) + "px";
		tip.style.top  = (y + yFromMouse) + "px";
	}
}

function showTip(id) {
	tip = document.getElementById(id);
	tip.style.display = "block";
}

function hideTip() {
	tip.style.display = "none";
}
</script>
</head> 
<body> 
<div class="tooltip" id="1">Text-Tooltip</div>
<div class="tooltip" id="2">
  <table align="left" width="100" cellpadding="0" cellspacing="0" border="0">
    <tr>
	  <td></td>

	</tr>
  </table>Bilder mit beliebig 
viel Text!
Sie können 
alle HTML-Tags
 benutzen.
</div>
<div class="tooltip" id="3" style="width:200px;"><div class="head">Tooltip mit HTML-Tags:</div>

<table width="100%" class="table">
  <tr>
    <td><div align="center">Zeile 1 Spalte 1</div></td>

    <td><div align="center">Zeile 1 Spalte 2</div></td>
  </tr>
  <tr>
    <td><div align="center">Zeile 2 Spalte 1</div></td>
    <td><div align="center">Zeile 2 Spalte 2</div></td>
  </tr>
</table>
</div>

</div>
[url="#"]Tooltip 1 (Text)[/url]

[url="#"]Tooltip 2 (Text und Bild)[/url]

[url="#"]Tooltip 3 (beliebige HTML-Tags)[/url]

<span onMouseOver="showTip('1');" onMouseOut="hideTip();">Text mit Tooltip</span>
</body>
</html>
 

blackout

Schaf im Wolfspelz

also ein wunderbares javascript ("wunderbar" ist hier als ein sehr relativer begriff zu sehen...) dafür ist . damit kann man einerseits text, andererseits auch bilder mit verschiedenen optionen beim mouseover einblenden. wenn mich nicht alles täuscht sind die thumbnails bei den tutorials auch mit overlib gemacht.
 
Bilder bitte hier hochladen und danach über das Bild-Icon (Direktlink vorher kopieren) platzieren.
Antworten auf deine Fragen:
Neues Thema erstellen

Willkommen auf PSD-Tutorials.de

In unseren Foren vernetzt du dich mit anderen Personen, um dich rund um die Themen Fotografie, Grafik, Gestaltung, Bildbearbeitung und 3D auszutauschen. Außerdem schalten wir für dich regelmäßig kostenlose Inhalte frei. Liebe Grüße senden dir die PSD-Gründer Stefan und Matthias Petri aus Waren an der Müritz. Hier erfährst du mehr über uns.

Stefan und Matthias Petri von PSD-Tutorials.de

Nächster neuer Gratisinhalt

03
Stunden
:
:
25
Minuten
:
:
19
Sekunden

Flatrate für Tutorials, Assets, Vorlagen

Zurzeit aktive Besucher

Statistik des Forums

Themen
175.155
Beiträge
2.581.855
Mitglieder
67.221
Neuestes Mitglied
opaklaus
Oben