|
|
|
|
Mouseover Effekt. |
ZeRo
Aufsteiger
Dabei seit: 03.06.2004
Beiträge: 98
|
|
Mouseover Effekt. |
|
Ich suche nach einer Möglichkeit des folgenden Problemes:
Ich möchte, dass wenn man mit der maus über einen Punkt fährt, dass dann an einem andern Ort ein Bild und neben dem Bild ein Text erscheint… wie mache ich das ?
Java ? Html ?
|
|
05.11.2004 17:46 |
|
|
LX
El Comandante en Jefe
Dabei seit: 25.11.2001
Beiträge: 5.372
Herkunft: Berliner Bronx
|
|
JavaScript. Zum Beispiel so:
code: |
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
|
<div id="hilightzeug" style="visibility: hidden">
<img src="eintollesbild.jpg" alt="">
mit noch tollerem Text daneben.
</div>
[...]
<img src="einfetterpunkt.gif" alt=""
onmouseover="document.getElementById('hilightzeug').style.visibility='visible'"
onmouseout="document.getElementById('hilightzeug').style.visibility='hidden'">
|
|
__________________ JS-Games.de - Misled Scripting Skills Gone Mad | Meine Filmkritiken | Urban Photography
Kommt mal in den IRC-Channel: irc.eu.freenode.net | Port 6667 | #blackboard
"Ever tried. Ever failed. No matter.
Try again. Fail again. Fail better."
- Samuel Beckett
|
|
05.11.2004 17:50 |
|
|
R2__
Aufsteiger
Dabei seit: 04.10.2004
Beiträge: 34
Herkunft: /home/R2
|
|
|
|
oder das ....
hoffe du kommst damit klar. Im Head brauchst du nichts umstellen.
code: |
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:
34:
35:
36:
37:
38:
39:
40:
41:
42:
43:
44:
45:
46:
|
<html>
<head>
<title>Test
</title>
<script language="JavaScript">
<!--
function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
function MM_showHideLayers() { //v3.0
var i,p,v,obj,args=MM_showHideLayers.arguments;
for (i=0; i<(args.length-2); i+=3) if ((obj=MM_findObj(args[i]))!=null) { v=args[i+2];
if (obj.style) { obj=obj.style; v=(v=='show')?'visible':(v='hide')?'hidden':v; }
obj.visibility=v; }
}
function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}
//-->
</script>
</head>
<body>
<a href="Link.html" onMouseOut="MM_swapImgRestore()"
onMouseOver="MM_swapImage('name','','zweitesBild.jpg',1);MM_showHideLayers('Layer1','','hide','Layer2','','hide')"><im
g name="name" border="0" src="erstesBild.jpg" width="150" height="50"></a>
</body>
</html>
|
|
__________________ DAUs sind auch nur Menschen ?
Dieser Beitrag wurde 1 mal editiert, zum letzten Mal von R2__: 10.11.2004 14:52.
|
|
10.11.2004 14:50 |
|
|
Wenso
Amokschläfer
Dabei seit: 25.02.2002
Beiträge: 1.715
Herkunft: Hessen
|
|
also ich finde LX' Möglichkeit deutlich besser, da sie mit weniger Code auskommt und verständlicher ist!
R2: das ist doch der Code, den Macromedia benutzt bei solchen Sachen!
Und da ist auch unnötiges dabei, wenn man nur einen Bild-Wechsel machen will!
Mfg wenso
__________________
|
|
10.11.2004 17:31 |
|
|
ZeRo
Aufsteiger
Dabei seit: 03.06.2004
Beiträge: 98
Themenstarter
|
|
Zitat: |
Original von LX
JavaScript. Zum Beispiel so:
code: |
1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
|
<div id="hilightzeug" style="visibility: hidden">
<img src="eintollesbild.jpg" alt="">
mit noch tollerem Text daneben.
</div>
[...]
<img src="einfetterpunkt.gif" alt=""
onmouseover="document.getElementById('hilightzeug').style.visibility='visible'"
onmouseout="document.getElementById('hilightzeug').style.visibility='hidden'">
|
|
|
Mit dem komme ich nun ganz gut zurecht vielen dank...
Nun habe ich nich folgende 2 Probleme:
Wie kann ich machen, dass anstatt dem Punkt, man über eine Schrift fahren muss, damit das ganze erscheint ?
Und wie kann ich sagen, wo der Text und das Bild erscheinen sollen ?
|
|
11.11.2004 08:43 |
|
|
LX
El Comandante en Jefe
Dabei seit: 25.11.2001
Beiträge: 5.372
Herkunft: Berliner Bronx
|
|
Zitat: |
Original von ZeRo
Wie kann ich machen, dass anstatt dem Punkt, man über eine Schrift fahren muss, damit das ganze erscheint ? |
code: |
1:
|
<span onmouseover="..." onmouseout="...">dein toller Text</span> |
|
Zitat: |
Und wie kann ich sagen, wo der Text und das Bild erscheinen sollen ? |
Setze die oberen 4 Codezeilen (also die DIV und das dazwischen) an die Stelle im Code, wo du's eben hinhaben willst. Du kannst ja erstmal das visibility: hidden weglassen, um die Position zu überprüfen.
__________________ JS-Games.de - Misled Scripting Skills Gone Mad | Meine Filmkritiken | Urban Photography
Kommt mal in den IRC-Channel: irc.eu.freenode.net | Port 6667 | #blackboard
"Ever tried. Ever failed. No matter.
Try again. Fail again. Fail better."
- Samuel Beckett
|
|
11.11.2004 14:24 |
|
|
DunklerMond
SeelenWächter
Dabei seit: 06.10.2002
Beiträge: 119
Herkunft: beinahe Düsseldorf
|
|
Ich habe das ganze mit CSS gestaltet
ungefähr so....
Zitat: |
<style type="text/css">
#menu {
position:absolute; top:500px; left:300px; font-size:12pt;}
/* NS braucht width nur, um Menue in senkr. block darst. zu koennen, hier weggelassen */
#navi {
}
#navi a:link {text-decoration: none; color: #cccccc;cursor:crosshair;width:70px;}
#navi a:visited {text-decoration: none; color: #AA0000;cursor:crosshair;
}
#navi a:hover {text-decoration: none; color: #FF0000; background-color: #555555;cursor:crosshair;font-size: 14pt;
}
#navi a:active {text-decoration: none; font-style: italic; color: #AA0000;cursor:crosshair;
}
#navi a .showcase {
display: none; }
#navi a:hover .showcase {
position:absolute; width:300px; height:120px; top:-180px; left:60px;
display:block; background:#333333; border:solid 1px; color:#607E9F;
padding:10px;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:8pt; }
/* Unterschied block/inline nur bei NS */
</style>
|
....
und dort wo der Link dann (kann auch normaltext sein,musst dann nur dementsprechend variabel setzen)
Zitat: |
<div id="menu">
<div id="navi"; >
[<a href="musikwelt/index.htm" title="BandLyrics" style=""onmouseover="window.status='www.md-fan.de | copyright by DreamerM 1997-2004 | Zugriff auf die BandLyrics dieser Seite';return true"> Welt der Musik
<span class="showcase">
<img src="image/musik.jpg" border=0 height="98" weight="87" alt=""></img>
<br>
Hier findest du BandLyrics von mir gern gehörte Bands</span>
</a>]
[<a href="bildausschnitt/index.htm" style=""onmouseover="window.status='www.md-fan.de | copyright by DreamerM 1997-2004 | Bilder Bilder Bilder';return true" title="Der Bilderrahmen als Fenster für den Voyeur"> Leben im Bildausschnitt
<span class="showcase">
<img src="image/bild.jpg" border=0 height="100" weight="98" alt=""></img>
<br>
Bilder nicht nur von mir, sondern von wichtigen Menschen und was mir vor die Linse kam
</span>
</a>]
[<a href="seelenwelt/index.htm" style=""onmouseover="window.status='www.md-fan.de | copyright by DreamerM 1997-2004 | Meine Seele, meine Texte und Gedichte - alles über mein Ich';return true" title="Wer steckt hinter diesen worten?!"> GedankenWelt
<span class="showcase"; font-size:100%;>
<img src="image/chain.jpg" border=0 height="90" weight="90" alt=""></img>
<br>
Gedanken, Texte, Erinnerungen, Gedichte, Fragebogen
</span>
</a>]
</div>
</div>
|
__________________
Das Schicksal beschützt Narren, kleine Kinder und Schiffe mit dem Namen Enterprise
|
|
11.11.2004 15:08 |
|
|
ZeRo
Aufsteiger
Dabei seit: 03.06.2004
Beiträge: 98
Themenstarter
|
|
ok hat sich erledigt vielen dank nochmals !
|
|
11.11.2004 16:55 |
|
|
ZeRo
Aufsteiger
Dabei seit: 03.06.2004
Beiträge: 98
Themenstarter
|
|
Nun such ich nach einer Lösung, dass wenn man über ein Bild fährt, dieses durch ein anderes ersetzt wird, finde unter selfhtml, jedoch nicht's nicht's entsprechendes.
|
|
14.11.2004 20:56 |
|
|
ZeRo
Aufsteiger
Dabei seit: 03.06.2004
Beiträge: 98
Themenstarter
|
|
^^ lol ich depp ... danke
|
|
14.11.2004 22:12 |
|
|
|
|
|
|