Hover bei normalem text, ohne link

[.::crazycons::.]

Moinsen,
ich versuche grade bei nem Text nen Hover zu machen, der kein Link ist, also wo beim Klick nix passiert und wo vor Allem beim Tab kein stop produziert wird. Momentan hab ich das so:
<a href="javascript:void(0);" class="hov">text</a>

Habs auch schon mit einem
<p class="hov">text</p> versucht, aber das bewirkt ja auch nen Absatz. Wie muß ich das machen?
mfg
de nixbligger

P.S.: das hov ist natürlich im head festgelegt, das funzt auch.

[Ed X]

Hi,

Habs auch schon mit einem
<p class="hov">text</p> versucht, aber das bewirkt ja auch nen Absatz. Wie muß ich das machen?

was mich interessieren würde, ist wie die css für p.hov aussieht.

wenn das mit p wirklich geht, warum nimmst du dann nicht span, das er-
zeugt keinen Absatz.

ansonsten bleibt dir immer noch span in Tateiheit mit einem javascript,
welches die css-eigenschaften bearbeitet.

bye eddie

[fastix]

<script type="text/javascript">
function js_hover (obj,style_nr){
  document.getElementsById.(obj).style.backgroundColor=(style_nr) ? "#ff0000":"#ffffff";
}
</script>
<style type="text/css">
p { background-color:#ffffff; }
</style>

<p>Text <span id="Nr1" onMouseover="js_hover('Nr1',1)" onMouseout="js_hover('Nr1',0)">Text</span> Text</p>

Ohne Js tutet es nicht, ab(er) was solls...

Nicht deszutrotz: Wozu brauchst Du die Spielerei? Mittlerweile erwarten alle Benutzer, das etwas, was beim Mauskontakt irgendwie wackelt, angeklickt werden kann. Stichwort "usability".

fastix

[fastix]

document.getElementsById.(obj).style.backgroundColor=(style_nr) ? "#ff0000":"#ffffff";

->   document.getElementById.(obj).style.backgroundColor=(style_nr) ? "#ff0000":"#ffffff";

[Spelling]

[fastix]

document.getElementsById.(obj).style.backgroundColor=(style_nr) ? "#ff0000":"#ffffff";

->   document.getElementById.(obj).style.backgroundColor=(style_nr) ? "#ff0000":"#ffffff";

->> document.getElementById(obj).style.backgroundColor=(style_nr) ? "#ff0000":"#ffffff";
[Spelling II] (Versuch.number="letzter")

tested[tm]

[.::crazycons::.]

Ich brauche die Spielerei nur zur grafischen Verbesserung. Sieht, wenn mans nicht übertreibt ganz gut aus.
mfg
de nixbligger

[.::crazycons::.]

Das war ja mein Problem, daß das mit p nen Absatz machte und ich net gerafft hab, daß es mit span geht.
mfg
de nixbligger

[MudGuard]

Hi,

ich versuche grade bei nem Text nen Hover zu machen, der kein Link ist, also wo beim Klick nix passiert und wo vor Allem beim Tab kein stop produziert wird. Momentan hab ich das so:
<a href="javascript:void(0);" class="hov">text</a>

<span>text</span>
und im CSS
span:hover { color:red; }

P.S.: technisch rückständige Browser wie der IE 6 oder der Netscape 4.x können das natürlich nicht...

cu,
Andreas

[emu]

Hallo!

ich versuche grade bei nem Text nen Hover zu machen

Warum? Das erschwert es, den Text zu lesen und ist daher nicht sinnvoll.

Habs auch schon mit einem
<p class="hov">text</p> versucht, aber das bewirkt ja auch nen
Absatz.

Du könntest mit span und der Pseudoklasse :hover arbeiten. Nur wirst du
da Probleme mit den meisten Browsern bekommen, inklusive Internet
Explorer.

Wie muß ich das machen?

Am besten gar nichts, s.o.

emu
[...]

[Cheatah]

Hi,

ich versuche grade bei nem Text nen Hover zu machen
Warum? Das erschwert es, den Text zu lesen und ist daher nicht sinnvoll.

Hintergrund- und evtl. Textfarbe anzupassen erachte ich als nicht wirklich schlimm, wenn es nicht gerade ungeschickt eingesetzt wird. Hierdurch kann man sehr leicht den aktuellen Textblock von danebenliegenden abgrenzen, ohne dies durch Trennelemente (z.B. Abstände) machen zu müssen. Allerdings wird der User vermutlich (und nicht ganz zu Unrecht) erwarten, dass das entsprechende Element mit einer Funktion versehen ist, sprich: klickbar ist.

Eine andere Anwendung ist übrigens, innerhalb einer Tabelle die Zeilen oder Spalten :hover mit einer anderen Hintergrundfarbe zu versehen, damit insbesondere bei großen Tabellen die Lesbarkeit sogar vereinfacht wird.

Diese Methodik einfach nur "weil es geht" einzusetzen ist natürlich - wie bei den meisten Techniken - völlig falsch, da hast Du Recht. Man sollte immer den Nutzen gegen den potentiellen Schaden (insb. auch Verwirrung des Users) abwägen.

Cheatah

[emu]

Hallo!

Hintergrund- und evtl. Textfarbe anzupassen erachte ich als nicht
wirklich schlimm, wenn es nicht gerade ungeschickt eingesetzt wird.

Ich finde, es irritiert einerseits, weil es das Auge ablenkt und
andererseits, weil man ähnlich wie bei unterstrichenen Texten einen
Link erwartet. Und Benutzer verwirren ist nicht sehr schlau.

Hierdurch kann man sehr leicht den aktuellen Textblock von
danebenliegenden abgrenzen, ohne dies durch Trennelemente (z.B.
Abstände) machen zu müssen.

Auf welcher Seite ist der Platz so beengt, dass man den Besucher so
etwas zumuten muss?

Eine andere Anwendung ist übrigens, innerhalb einer Tabelle die
Zeilen oder Spalten :hover mit einer anderen Hintergrundfarbe zu
versehen, damit insbesondere bei großen Tabellen die Lesbarkeit
sogar vereinfacht wird.

Dann verdeckt aber der Cursor meistens den Text.

emu
[...]

[Cheatah]

Hi,

Ich finde, es irritiert einerseits, weil es das Auge ablenkt und
andererseits, weil man ähnlich wie bei unterstrichenen Texten einen
Link erwartet. Und Benutzer verwirren ist nicht sehr schlau.

letzteres kann einschränkungsfrei bejaht werden ;-) und was den Rest betrifft: _Meistens_ hast Du da sicher Recht, und der Rest dürfte eine Meinungsfrage sein.

Hierdurch kann man sehr leicht den aktuellen Textblock von
danebenliegenden abgrenzen, ohne dies durch Trennelemente (z.B.
Abstände) machen zu müssen.
Auf welcher Seite ist der Platz so beengt, dass man den Besucher so
etwas zumuten muss?

Keine Ahnung, es war nur ein Beispiel, welches ich nicht ganz abwägig finde.

Eine andere Anwendung ist übrigens, innerhalb einer Tabelle die
Zeilen oder Spalten :hover mit einer anderen Hintergrundfarbe zu
versehen, damit insbesondere bei großen Tabellen die Lesbarkeit
sogar vereinfacht wird.
Dann verdeckt aber der Cursor meistens den Text.

Der Mauszeiger? Nö, denke ich nicht. Gerade in sehr lückenreichen Tabellen kann dieses Verfahren zu einer besseren Orientierung führen.

Cheatah

[Sabina]

Mit dem in Tipps&Tricks angegebenen Beispiel für Infoboxen kann man Drop-Down Menüs erzeugen, die sich harmonisch in Seiten einfügen, allerdings darf man dafür hover nicht wie angegebn auf ein a- Element sondern auf z.B ein div anwenden, dadurch kann man die Links im erzeugten Menü oder in der Zusatzinfobox verwenden. (Allerdings funktioniert es nicht mit IE &, aber dem stellt man im sichtbaren Bereich einfach einen Link zur Indexseite zur Verfügung)

[Kalle]

Also, ich hab da durch Zufall was entdeckt, weil ich für einen Test den Link de-aktiviert habe, also _ref statt href:

<a _ref="http://xxx.htm">Text</a>

Der Text wurde beim Hovern hervorgehoben, vielleicht geht es ja auch ganz legal mit

<a name="...">Text</a>

Wichtig ist wohl nur der Anker-Tag. Ich benutze den Mozilla 1.0

Gruß aus Worms, Kalle

[Christian Seiler]

Hallo Kalle,

Wichtig ist wohl nur der Anker-Tag. Ich benutze den Mozilla 1.0

Mozilla wendet die Pseudoklasse :hover auf _alle_ Elemente, die angezeigt werden, an. Das ist auch so im CSS2-Standard definiert. Opera und Konqueror können es auch. (Opera erst ab Version 7) Der IE und Opera 5/6 können dagegen :hover nur auf Links anwenden.

http://www.xs4all.nl/~ppk/css2tests/

Grüße,

Christian

[Cheatah]

Hi,

Also, ich hab da durch Zufall was entdeckt, weil ich für einen Test den Link de-aktiviert habe, also _ref statt href:

und schon hast Du defekten HTML-Code erzeugt. Es ist nicht abzusehen, wie bereits existierende Browser darauf reagieren; von zukünftigen ganz zu schweigen.

Kids, don't do this at home.

Wichtig ist wohl nur der Anker-Tag. Ich benutze den Mozilla 1.0

Mozilla beherrscht Pseudoklassen bei (fast) allen Elementen, auch bei <span>, während andere Browser hierbei auf Links beschränkzt sind - und die definieren sich durch den <a>-Tag _und_ das href-Attribut.

Cheatah