HTM in neuem Layer bei MouseOver

bullard

Grünschnabel
Hallo zusammen,

ich habe folgende Vorstellung:

Ich habe eine Site mit mehreren Bildern von Personen, geh ich nun mit der Mouse über ein Bild, öffnet sich ein neues Layer (bei festgelegter Layergröße) mit einer htm-Datei die eine art "Karteikarte" mit Infos zur Person sowie einem größeren Bild enthält. Geh ich nun wieder vom Bild weg, schliesst sich auch automatisch das Layer wieder.HIER gibts sowas ähnliches...


Könnte mir hierbei jemand unter die Arme greifen um das zu realisieren ?!

Vielen Dank schon mal an alle, die sich meinem Anliegen annehmen.

MfG Klaus
 
Zuletzt bearbeitet:
Im Prinzip ist es nicht schwer. Du schreibst einen Iframe in einen Layer rein und gibst dem Layer eine Id und dem Iframe einen namen, damit du beides möglichst beqeuem ansprechen kannst. Alles erstmal ohne Javascript, so wie du es haben willst. Dann kannst du den Layer über style="display:none;" versecken.

Wenn du ihn jetzt bei überfahren eines Elements mit der Maus sichtbar machen willst musst du in das Element onmouseover="document.getElementById('IdDesLayers').style.display = 'block';" reinschreiben bzw. für's unsichtbarmachen eben display='none' bei onmouseout. Wenn du das jetzt noch mit dem ensprechenden Befehl um eine Datei in den Iframe zu laden verbindest, bist du fertig. Diese Befehl heißt window.frames['NameDesIframes'].location.href = 'http://www.beispiel.de/datei.html'.

Wenn noch etwas unklar ist, lese dir bitte erstmal gewisse Grundkenntnis in Javascript an bevor du fragst, denn wir sind kein Javascriptkurs, sondern ein Forum. Bitte nicht übel nehmen ich sage das nur prophylaxisch (siehe zu dem Thema auch den Thread "keine Ahnung von Javascript").
 
Danke schonmal für die Antwort,

allerdings bringt sie mich nicht wirklich weiter, da ich es so schon versucht hab, leider erfolglos. Naja bin auch nicht die große Leuchte... aber um mich jetzt lange durch die Tutorials durchzuarbeiten, habe ich leider auch nicht die Zeit, denn neben Arbeit habe ich noch Frau und Kind

Über etwas (wenigstens Halbfertiges) würde ich mich riesig freuen.
 
http://www.webmatze.de/webdesign/javascript/tooltips.htm

hier ist ein kurzes Tutorial das hoffe ich mal deine fragen beantwortet.

habe selbst leider auch nicht viel ahnung von javascript, und habe ein problem wenn ich variable texte in diese "tooltips" einbringen will. aber einfach text ausgabe funktioniert einwandfrei.

vll kann mir ja auch jemand bei meinem problem helfen.
ich habe z.b. für jeden user ein wert x in der datenbank, der von user zu user unterschiedlich ist, wie kann ich dynamisch den jeweiligen wert in dem tooltip darstellen ?

bei der ich könnte ja ohne probleme eine weiter vaible zu showWMTT hin zufügen die dann z.b. die userid enthällt, mir der ich dann die werte aus der datenbank holen könnte, aber wie übergebe ich dir variable dann das jeweilige layer ?

PHP:
<script>
<!--
wmtt = null;

document.onmousemove = updateWMTT;

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

function showWMTT(id) {
	wmtt = document.getElementById(id);
	wmtt.style.display = "block"
}

function hideWMTT() {
	wmtt.style.display = "none";
}
//-->
</script>

danke im vorraus
greetz ShabbY
 

Neue Beiträge

Zurück