Grafiken mit Textlinks verbinden?
Tobias Mirsch
- css
0 Thomas Luethi0 Christoph Schnauß0 Tobias Mirsch0 at0 Tobias Mirsch0 at0 Tobias Mirsch0 at
Hallo,
ich habe im head meiner Seite einen CSS Befehl eingegeben:
<style type="text/css">
a:link {
font-family:Verdana,Arial,Helvetica;
text-decoration:none;
color:#2E4B6B;
}
a:visited {
font-family:Verdana,Arial,Helvetica;
text-decoration:none;
color:#2E4B6B;
}
a:active {
font-family:Verdana,Arial,Helvetica;
text-decoration:none;
color:#F8872B;
}
a:hover {
font-family:Verdana,Arial,Helvetica;
text-decoration:none;
color:#F8872B;
}
</style>
Jetzt will ich es so haben das ein Bild (nennen wir es bild1.jpg) sich beim mouseover so verhält als würde ich mit der Maus über Textlink1 gehen.
Das ganze ist in Tabellenform und der Textlink befindet sich nicht direkt neben dem Bild. Sonst hätte ich einfach <a href=......> vor das bild gepackt. Aber es gibt einige Zeilen und andere bilder und Links zwischen Bild1.jpg und textlink1.
Also wie geht das jetzt? Ich muss unbedingt ein Mouseover hinkriegen der den text so verändert wie oben im css quelltext beschrieben.
Hallo,
ich habe im head meiner Seite einen CSS Befehl eingegeben:
Vorschlag:
Nimm die Font-Sache vorweg, und fuege ein sans-serif an:
a { font-family:Verdana,Arial,Helvetica,sans-serif; }
Dann kannst Du es Dir in den Pseudoklassen ersparen...
Jetzt will ich es so haben das ein Bild (nennen wir es bild1.jpg) sich beim mouseover so verhält als würde ich mit der Maus über Textlink1 gehen.
Also wie geht das jetzt? Ich muss unbedingt ein Mouseover hinkriegen der den text so verändert wie oben im css quelltext beschrieben.
Also, die "einfache, sichere" Loesung ist wohl, mit JavaScript
rumzuspielen.
Da Du ausdruecklich nach CSS fragst, empfehle ich Dir, einmal
die Beispiele von Eric Meyer anzuschauen:
http://www.meyerweb.com/eric/css/edge/
Jemand anderes wird Dir sicher noch den Link zu etwas
aehnlichem hier in SelfHTML liefern koennen...
HTH, Gruesse,
Thomas
Also, die "einfache, sichere" Loesung ist wohl, mit JavaScript
rumzuspielen.
Da Du ausdruecklich nach CSS fragst, empfehle ich Dir, einmal
die Beispiele von Eric Meyer anzuschauen:
http://www.meyerweb.com/eric/css/edge/
Naja wenn es die einfachere Lösung ist mit Javascript nehme ich natürlich was ich kriegen kann :D
hallo Tobias,
Jetzt will ich es so haben das ein Bild (nennen wir es bild1.jpg) sich beim mouseover so verhält als würde ich mit der Maus über Textlink1 gehen.
Das ist prinzipiell mit CSS möglich (Javascript brauchst du nicht _zwingend_ dafür), aber du mußt daran denken, daß der Internet Explorer den "hover"-Effekt nicht für alle HTML-Elemente befolgen kann. Du müßtest also deine Bilder extra in einen link stellen.
Das Einbinden eines Bildes in CSS geht mit "background-image:url()" völlig problemlos.
Grüße aus Berlin
Christoph S.
Das Einbinden eines Bildes in CSS geht mit "background-image:url()" völlig problemlos.
Aber das bedeutet ja das das Bild ein Hintergrund Bild ist. Soll ja nicht sein. Das Bild ist ein ganz normales bild wo der link auch nochmal drauf liegt. Ich glaube ich kopiere am besten mal ein teil hier rein:
<TABLE border=0 cellspacing=6 cellpadding=1>
<TR valign=top>
<TD><CENTER><a href=komplettpc.htm><IMG src="images/pc.gif" title="Komplett PC's" alt="Komplett PC's" border=0>
</a>
</CENTER>
</TD>
...DANN KOMMEN WEITERE BILDER...
</TR>
<TR valign=top>
<TD><CENTER><a href=komplettpc.htm>Komplett PC's</a></CENTER></TD>
...
</TR>
</TABLE>
Ich hoffe ich drücke mich verständlich genug aus.
Hallo.
Aber das bedeutet ja das das Bild ein Hintergrund Bild ist. Soll ja nicht sein. Das Bild ist ein ganz normales bild wo der link auch nochmal drauf liegt.
Was spricht gegen ein Hintergrundbild? Ohne verdeckenden Vordergrund wird es doch einfach nur als Bild wahrgenommen.
MfG, at
Was spricht gegen ein Hintergrundbild? Ohne verdeckenden Vordergrund wird es doch einfach nur als Bild wahrgenommen.
Aber dann gehen doch die Links auf den "Hintergrundbildern" nicht mehr oder?
Hallo.
Aber dann gehen doch die Links auf den "Hintergrundbildern" nicht mehr oder?
Nein, aber wenn die Links auf transparente Elemente im Vordergrund übertragen werden, sollte das nicht weiter auffallen.
MfG, at
Nein, aber wenn die Links auf transparente Elemente im Vordergrund übertragen werden, sollte das nicht weiter auffallen.
Das Problem dabei ist aber das ich sowohl auf das Bild als auch per Link auf das angegebene Ziel kommen will.
Nur das halt beim überfahren des Bildes mit der maus der Text die Farbe ändert.
Hallo.
Das Problem dabei ist aber das ich sowohl auf das Bild als auch per Link auf das angegebene Ziel kommen will.
Und wo liegt da ein Problem? Befasse dich CSS im Allgemeinen und mit "display:block;" im Speziellen.
Nur das halt beim überfahren des Bildes mit der maus der Text die Farbe ändert.
Und wo liegt da ein Problem? Befasse dich CSS im Allgemeinen und mit "a:hover" im Speziellen.
MfG, at