Autor |
Nachricht |
Benri
Threadersteller
Dabei seit: 21.03.2007
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Mi 21.03.2007 20:49
Titel Mouseover bei frame |
|
|
Hallo!
Ich bräuchte mal ne Hilfe von einen Profi!
Ich habe eine website, in der Mitte befindet sich ein Frame.
Im Frame stehen Namen.
Ich will jetzt haben, wenn ich über den Namen drüberfahre, dann soll auf der "Hauptseite" ein Bild mit einen kleinen Test erscheinen. Wenn ich dann über einen anderen Namen gehe dann soll ein anderes Bild und Text stehen, usw.!
Ich habe schon selber was zusammengepfuscht, doch das funkt ned so wie ich will!
Hab schon lange im Inet gesucht, doch sowas habe ich leider nicht gefunden!
Bitte um Rat und danke schon im voraus für die Hilfe!
LG Benri
Zuletzt bearbeitet von Benri am Mi 21.03.2007 21:15, insgesamt 1-mal bearbeitet
|
|
|
|
|
rob
Dabei seit: 11.12.2003
Ort: ~/
Alter: 46
Geschlecht:
|
Verfasst Mi 21.03.2007 21:10
Titel
|
|
|
Zitat: | Ich habe schon selber was zusammengepfuscht |
Wie soll dir denn jemand helfen, wenn du uns nicht verräts, was du gemacht hast.
Wieso postest du denn den Code nicht?
Zitat: | das funkt ned so wie ich will! |
Was heißt das? Was für eine Fehlermeldung bekommst du? Was passiert? Was passiert nicht?
Zitat: | Hab schon lange im Inet gesucht, doch sowas habe ich leider nicht gefunden! |
Kann ich mir eigentlich nicht vorstellen. Wonach hast du denn gesucht?
Also wenn du in SelfHTML geschaut hättest, dann hättest du schon was gefunden. Da steht alles über HTML und Javascript drin, was du für diese Sache wissen mußt.
http://de.selfhtml.org
Zitat: | wenn ich über den Frame drüberfahre |
Wirklich über den Frame? oder über einen Text, einen Button oder ein anderes Element im Frame?
In jedem Fall brauchst du dazu den Eventhandler onmouseover oder onmouseout. Damit kannst du dann deine Javascript-Funktion zum Einblenden deines Textes aufrufen.
Ich würde die Elemente, die dann später angezeigt werden sollen, erstmal so auf die Seite setzen, wie sie später eingeblendet werden sollen. Vielleicht in ein div . Jedenfalls brauchst du irgendwas, dem du eine id zuordnen kannst, um den Krams anzusprechen. Dann setzt du den Krams entweder über display auf none oder über style.visibility auf hidden. Dann wird das nicht mehr angezeigt. Bei dem mouseover läßt du es dann sichtbar werden.
(Vermutlich ist es in diesem Fall besser, display auf none zu setzen, weil der Platz dann nicht freigehalten wird, wie wenn das Element nur unsichtbar geschaltet wird.)
Könnte in etwa so aussehen:
Code: | onmouseover="document.getElementById('deinElement').style.visibility = 'visible';" |
Naja, und wenn sich der Krams halt in einem anderen Frame befindet, dann ist das auch kein Problem. Du mußt dem Frame nur einen Namen geben und kannst es dann ansprechen. (Jedenfalls macht es das einfacher... Ansonsten könnte man das Frame allerdings auch über die Indexnummer ansprechen...)
Code: | window.frames[Frame].document |
Zuletzt bearbeitet von rob am Mi 21.03.2007 21:15, insgesamt 1-mal bearbeitet
|
|
|
|
|
Anzeige
|
|
|
Benri
Threadersteller
Dabei seit: 21.03.2007
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Mi 21.03.2007 21:21
Titel
|
|
|
mein code: Code: | <a target=_blank onMouseOver='return showPic(this)' href=../../picture/vorstand/SEILER.jpg>SEILER Gerda, DDr.</a> |
Da wird das Bild dann angezeigt: Code: | <img src="../../picture/blank.gif" name="placeholder" id="placeholder"> |
Alles im selben frame!
javascript:
Code: | function showPic (whichpic) {
if (document.getElementById) {
document.getElementById('placeholder').src = whichpic.href;
if (whichpic.title) {
document.getElementById('desc').childNodes[0].nodeValue = whichpic.title;
} else {
document.getElementById('desc').childNodes[0].nodeValue = whichpic.childNodes[0].nodeValue;
}
return false;
} else {
return true;
}
}
</script>
|
Aber das ist ein Link und das will ich nicht!
Sorry wegen Flüchtigkeitsfehler!
wie muss ich das machen wenn es ohne link geht?
Code: | onmouseover="document.getElementById('deinElement').style.visibility = 'visible';" |
Wohin muss ich das schreiben?
LG Benri
|
|
|
|
|
rob
Dabei seit: 11.12.2003
Ort: ~/
Alter: 46
Geschlecht:
|
Verfasst Mi 21.03.2007 22:53
Titel
|
|
|
sehr unschöner Code.
Code: | <a target=_blank onMouseOver='return showPic(this)' href=../../picture/vorstand/SEILER.jpg>SEILER Gerda, DDr.</a> |
Wie wäre es mit Anführungszeichen?
Code: | <a target="_blank" onMouseOver="return showPic(this);" href="../../picture/vorstand/SEILER.jpg">SEILER Gerda, DDr.</a> |
Außerdem sind Dateinamen wie SEILER.jpg potentielle Fehlerquellen. Unix-Dateisysteme sind casesensitiv, d.h. sie unterscheiden zwischen Groß- und Kleinschreibung.
SEILER.jpg und seiler.jpg und SEILER.JPG bezeichnen auf Windows immer die gleiche Datei. Lädst du deine Seite dann aber auf einen Webserver (die meist unter Unix/Linux laufen), dann wird da unterschieden...
Wenn dein Bild SEILER.jpg heißt und du es mit SEILER.JPG ansprichst, dann funktioniert das zuhause bei dir auf Windows, aber nicht mehr im Internet...
Am besten ist es, wenn man sich angewöhnt, alle Dateinamen immer kleinzuschreiben...
Imagetags müssen, wenn der Code valide sein soll, zwingend ein alt-Attribut enthalten. Das kannst du leer lassen, aber es muß da sein, wenn man korrekten Code schreiben will:
Code: | <img src="../../picture/blank.gif" name="placeholder" id="placeholder" alt=""> |
Zitat: | Wohin muss ich das schreiben? |
Das habe ich doch bereits geschrieben. Das mußt du dem Element zuweisen, was auf den mouseover reagieren soll.
Also du schreibst dein unsichtbares Element. Über display:none; wird es nicht angezeigt und es wird auch kein Platz dafür freigehalten.
Code: | <div id="blabla" style="display:none;">ich bin nicht da... aber man kann mich sichbar machen...</div> |
Dann packst du die mouseover-Funktion in das Element, was auf deinen mouseover reagieren soll, z.B. ein Link, ein Bild, ein div oder sonstwas:
Code: | <div onmouseover="document.getElementById('blabla').style.display= 'block';">sichtbar machen</div> |
oder du machst es über visibilty. Damit wird dein Element allerdings nur unsichtbar - der Platz dafür wird jedoch freigehalten.
Code: | <div id="blabla" style="visibility:hidden;">ich bin nicht da... aber man kann mich sichbar machen...</div> |
und
Code: | <div onmouseover="document.getElementById('blabla').style.visibility = 'visible';">sichtbar machen</div> |
Die Style-Angaben mußt du natürlich nicht direkt in jedem Element angeben. Die kannst du auch in ein Stylesheet auslagern...
Naja und du kannst halt eigentlich jedem Element diesen mouseover mitgeben - auch dem Body-Element deines Frames. Dann wird die Funktion halt aufgerufen, wenn die Maus über dein Frame fährt.
Wenn dann jedoch in einem anderen Frame etwas sichtbar geschaltet werden soll, dann mußt du dieses Frame über den Namen ansprechen, wie ich das bereits geschrieben hab...
Zuletzt bearbeitet von rob am Mi 21.03.2007 22:57, insgesamt 1-mal bearbeitet
|
|
|
|
|
Benri
Threadersteller
Dabei seit: 21.03.2007
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Fr 23.03.2007 21:17
Titel
|
|
|
brauch ich dazu java script?
LG Benri
|
|
|
|
|
rob
Dabei seit: 11.12.2003
Ort: ~/
Alter: 46
Geschlecht:
|
Verfasst Fr 23.03.2007 21:58
Titel
|
|
|
ja, brauchst du.
onmouseover ist ja bereits ein javascript-eventhandler.
allein mit css kannst du das nicht so bewerkstelligen, wie du es gerne hättest.
du kannst zwar mit hover arbeiten, aber mit jeder browser macht den hover auf jedem element mit.
außerdem brauchst du eine frameübergreifende lösung und mit css kannst du kein anderes frame ansprechen.
|
|
|
|
|
Benri
Threadersteller
Dabei seit: 21.03.2007
Ort: -
Alter: -
Geschlecht: -
|
Verfasst So 25.03.2007 11:11
Titel
|
|
|
Auch ich bin zu dumm für das! Ich schaffe es nicht!
Keine Ahnung! Ich habe eine "normale" html-Seite in dem ein i frame drin!
Würde mich sehr darüber freuen wenn mir jemand das machen könnte! Ich s****** die ganzen letzten Tage schon herum! Bin voll sauer auf mich! In letzter Zeit bring ich nix zusammen!
Bitte um Lösung! Danke! LG Benri
|
|
|
|
|
Raumwurm
Dabei seit: 21.12.2004
Ort: -
Alter: -
Geschlecht:
|
Verfasst So 25.03.2007 13:25
Titel
|
|
|
Keine Ahnung wie Dein Dokument aussieht, aber
das hier wäre z.b. ein Weg:
Dein Dokument mit dem eingebettetem Iframe:
Code: | <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Doc mit Iframe</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
</head>
<body>
<iframe src="benri-iframe.htm" name="datframe" marginheight="0" marginwidth="0" width="300" height="500" frameborder="0"></iframe>
<a href="#" onmouseover="parent.datframe.show('inhalt1');">Inhalt 1 zeigen</a>
<a href="#" onmouseover="parent.datframe.show('inhalt2');">Inhalt 2 zeigen</a>
<a href="#" onmouseover="parent.datframe.show('inhalt3');">Inhalt 3 zeigen</a>
</body>
</html>
|
Das Dokument mit dem Iframe-Inhalt:
Code: | <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Iframe Inhalt</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css">
<!--
DIV#inhalt1 {
background-color: red;
color: #fff;
display:none;
}
DIV#inhalt2 {
background-color: green;
color: #fff;
display:none;
}
DIV#inhalt3 {
background-color: black;
color: #fff;
display:none;
}
-->
</style>
<script type="text/javascript">
<!--
function show(id) {
document.getElementById(id).style.display = 'block';
}
-->
</script>
</head>
<body>
<div id="inhalt1">
Inhalt 1
</div>
<div id="inhalt2">
Inhalt 2
</div>
<div id="inhalt3">
Inhalt 3
</div>
</body>
</html>
|
Jenachdem müsstest Du die anderen Element halt noch ausblenden.
|
|
|
|
|
|
|
|
Ähnliche Themen |
Mouseover in Frame A steuert Pic in Frame B... geht das?
von Top Frame (Navi) NUR unteren Frame tauschen!?
Flash CS5 Frame-by-Frame... Performance-Problem
Bildergalerie Mouseover andere Position & Mouseover Scroll
Frame zu Frame verlinken
[Dreamweaver] Frame in Frame
|
|