nicht angemeldet
Linkfarbe nach Klick festsetzen
Hallo Forum,
meine Website ist aus 2 Frames (oben und unten) aufgebaut). Im oberen Frame befindet sich das Menü, im unteren wird der Inhalt angezeigt.
Mouse-over Effekte funktionieren:
.menue a:hover {color:#FFFFFF;}
.menue a:active {color:#000000;}
Nun dachte ich, dass es möglich ist, den Menüpunkt, der ausgewählt wurde und dessen Inhalt angezeigt wird, in einer anderen Farbe zu setzen, so dass er gehighlighted ist.
Doch leider kann ich dazu keine
passenden CSS-Definitionen finden.
Also der ausgewählte Menüpunkt soll so lange in einer anderen Farbe oder größer erscheinen, solange sich der Anwender in dieser Rubrik aufhält. Sobald er einen anderen Menüpunkt auswählt, soll dieser diese Style-Eigenschaft annehmen.
Ist aufwendige java-Script-Programmierung dafür notwendig?
Viele Grüße
Miriam
-
Mit JavaScript und CSS ist das möglich, habe das mal wo gelesen, finde aber gerade nicht den Link dazu.
Ich würde aber davon abraten, da viele JavaScript im Browser deaktiviert haben. Füge doch lieber eine eigene Klasse für den gerade "aktiven" Link ein und definiere da mit CSS dann das aussehen.--
Russe -
Hi,
Ist aufwendige java-Script-Programmierung dafür notwendig?
Ja - wobei ich das nicht als aufwendig bezeichnen würde.
Bzw. nein - wenn Du auf Frames verzichtest und dann im Menü der aufgerufenen Seite dessen Menüpunkt nicht als Link auszeichnest.freundliche Grüße
Ingo -
Hallo,
die Pseudo-Klasse :active ist, wenn ich nicht irre, für die gewünschte Auszeichnung des Links während des Daraufklickens (solange die Maus gedrückt ist) gedacht (bei der Angabe der Link-Pseudoklassen muss aber auch eine bestimmte Reihenfolge eingehalten werden, da gibt's so eine "Love/Hate"-Eselsbrücke oder alternative auch eine mit Darth Vader, an die ich mich aber gerade nicht genau erinnere).
Für das, was Du möchtest, gibt es aber keine Pseudoklasse, da für den Browser ja keine Assoziation eines Elements in einem Frame mit einem bestimmten Dokument besteht.
Einem Link, der in einer bestimmten Weise ausgezeichnet werden soll, müsste man also z.B. entweder eine dedizierte Klasse zuweisen:
<a href="seite2.html" class="current">Seite 2</a>
(und diese Klasse natürlich vorher wunschgemäß definieren), oder, was ich meist aus semantisch-ästhetischen :) Gründen bevorzuge, den Link mit einer Auszeichnung durch ein HTML-Tag versehen, z.B.
<strong><a href="seite2.html">Seite 2</a></strong>
und dann entsprechend eine verschachtelte Klasse definieren.
strong a {...}
(Am besten noch mit einem speziellen div drumrum, damit der Style nicht auf alle strongen a's wirkt).
Da Du Frames verwendest, wirst Du deshalb auch nicht ohne JavaScript auskommen.
Grüße,
Mirko
-
Hi,
die Pseudo-Klasse :active ist, wenn ich nicht irre, für die gewünschte Auszeichnung des Links während des Daraufklickens (solange die Maus gedrückt ist) gedacht
korrekt. Daher ist Russes Hinweis nutzlos.
oder, was ich meist aus semantisch-ästhetischen :) Gründen bevorzuge, den Link mit einer Auszeichnung durch ein HTML-Tag versehen, z.B.
<strong><a href="seite2.html">Seite 2</a></strong>
sehr unsauber. Besser: <strong>Seite 2</strong>
(Am besten noch mit einem speziellen div drumrum, damit der Style nicht auf alle strongen a's wirkt).
Noch schlechter. Meist besteht bereits ein Elternelement, über das dieser Nachfahre selektiert werden kann.
freundliche Grüße
Ingo-
Hallo,
oder, was ich meist aus semantisch-ästhetischen :) Gründen bevorzuge, den Link mit einer Auszeichnung durch ein HTML-Tag versehen, z.B.
<strong><a href="seite2.html">Seite 2</a></strong>
sehr unsauber. Besser: <strong>Seite 2</strong>Wieso? Eigentlich habe ich nie verstanden, wieso, wenn man auf einer Seite ist, der Navipunkt zu eben dieser Seite nicht mehr verlinkt sein soll. Ich sehe keinen logischen Grund.
(Am besten noch mit einem speziellen div drumrum, damit der Style nicht auf alle strongen a's wirkt).
Noch schlechter. Meist besteht bereits ein Elternelement, über das dieser Nachfahre selektiert werden kann.Das meinte ich doch. Z.B. <div id="navi">...</div> ;)
-
Hi,
Wieso? Eigentlich habe ich nie verstanden, wieso, wenn man auf einer Seite ist, der Navipunkt zu eben dieser Seite nicht mehr verlinkt sein soll. Ich sehe keinen logischen Grund.
weil es sinnlos ist und zudem verwirrend, wenn ein Link vorhanden ist, der keine Funktion erfüllt. Deshalb ist so etwas auch extra als nicht barrierefrei eingestuft.
Das meinte ich doch. Z.B. <div id="navi">...</div> ;)
ok, bei <ul> hättest Du auch meinen Segen. ;-)
freundliche Grüße
Ingo-
Hallo,
weil es sinnlos ist und zudem verwirrend, wenn ein Link vorhanden ist, der keine Funktion erfüllt. Deshalb ist so etwas auch extra als nicht barrierefrei eingestuft.
Also, was das speziell mit Barrierefreiheit zu tun hat, sehe ich nicht. Außer vielleicht, dass ein Sehbehinderter beim Menü einen Punkt vorgelesen bekommt, der einer Seite entspricht, auf der er gerade schon ist. Aber um das zu indizieren, ist es vom semantischen Standtpunkt aus doch sinnvoller, auf eben jene Seite z.B. eine <h1>-Überschrift mit entsprechendem Titel zu setzen, damit man weiß, wo man ist. Das Menü/die Navi ist und bleibt Menü/Navi und führt eben nach wie vor zu allen Seiten, zu denen sie führt. Warum sollte sich daran was ändern?
Das meinte ich doch. Z.B. <div id="navi">...</div> ;)
ok, bei <ul> hättest Du auch meinen Segen. ;-)Klar, das auf jeden Fall auch noch :)
Mirko
-
Hi,
Also, was das speziell mit Barrierefreiheit zu tun hat, sehe ich nicht. Außer vielleicht, dass ein Sehbehinderter beim Menü einen Punkt vorgelesen bekommt, der einer Seite entspricht, auf der er gerade schon ist.
Darum geht es nicht ausschließlich. Auch ein Sehender könnte auf die Idee kommen, einen solchen Link anzuklicken und würde dann feststellen, daß sich (außer vielleicht einem kurzen Aufflackern) nichts tut.
Natürlich ist es sinnvoll, durchgehend ein einheitliches Menü zur Verfügung zu stellen und ebenso, den aktuellen Menüpunkt hervorzuheben - die Seitenüberschrift wird nicht in allen Fällen dem meist verkürztem Linktext entsprechen. Nur eine Verlinkung ist unnötig und irreführend.freundliche Grüße
Ingo-
Hallo,
Darum geht es nicht ausschließlich. Auch ein Sehender könnte auf die Idee kommen, einen solchen Link anzuklicken und würde dann feststellen, daß sich (außer vielleicht einem kurzen Aufflackern) nichts tut.
Natürlich ist es sinnvoll, durchgehend ein einheitliches Menü zur Verfügung zu stellen und ebenso, den aktuellen Menüpunkt hervorzuheben - die Seitenüberschrift wird nicht in allen Fällen dem meist verkürztem Linktext entsprechen. Nur eine Verlinkung ist unnötig und irreführend.Ein Link ist ja nicht per se zum Klicken gedacht und muss das auch nicht immer suggerieren – je nach Aussehen (oder generell: Wirkung) eben, und eben _das_ sollte man bei dem jeweils aktuellen Link ändern, nicht seine sonstige Funktionalität. Gerade semantisch ist es also sinnvoll, den Punkt als Link zu lassen, ein Unterschied muss hier eher in der Semiotik gemacht werden :).
Ein Pappschild z.B. hat ja auch nicht immer hinweisenden Charakter, sondern kann auch z.B. Dämmung o.ä. sein. Trotzdem bleibt es ein Schild. Naja... bei längerem Überlegen fällt mir vielleicht noch ein besserer Vergleich ein ;)
Mirko
-
Hi,
Natürlich ist es sinnvoll, durchgehend ein einheitliches Menü zur Verfügung zu stellen und ebenso, den aktuellen Menüpunkt hervorzuheben - die Seitenüberschrift wird nicht in allen Fällen dem meist verkürztem Linktext entsprechen. Nur eine Verlinkung ist unnötig und irreführend.
Ein Link ist ja nicht per se zum Klicken gedacht
wozu denn sonst? Du hast aber eine eigenwillige Vorstellung von Verweisen.
und muss das auch nicht immer suggerieren – je nach Aussehen (oder generell: Wirkung) eben, und eben _das_ sollte man bei dem jeweils aktuellen Link ändern, nicht seine sonstige Funktionalität.
Welche Funktionalität denn? Ich sehe wie gesagt keine bzw. nur eine, die Verwirrung stiften kann. Und mal ehrlich: findest Du es sinnvoller, den Hand-Cursor hier zu ändern, als das a-Element einfach zu entfernen bzw. durch ein passenderes zu ersetzen?
Gerade semantisch ist es also sinnvoll, den Punkt als Link zu lassen, ein Unterschied muss hier eher in der Semiotik gemacht werden :).
Ich sehe keinen semantischen Sinn in einem nutzlosen Element - im Gegenteil.
freundliche Grüße
Ingo-
Hallo,
Ein Link ist ja nicht per se zum Klicken gedacht
wozu denn sonst? Du hast aber eine eigenwillige Vorstellung von Verweisen.Ein Link ist zunächst mal, sagen wir mal eine "Technik", um eine Art Struktur/Zusammenhang zwischen z.B. Dokumenten aller möglichen Art zu definieren oder zu "erzeugen". Dass man so ausgezeichnete Elemente anklicken kann, ist eine komfortable Erscheinung für den Menschen, der sich mit den so strukturierten Daten befasst. So erzeugte Zusammenhänge lassen sich aber auch noch ganz anders darstellen, wenn sie gut strukturiert wurden.
und muss das auch nicht immer suggerieren – je nach Aussehen (oder generell: Wirkung) eben, und eben _das_ sollte man bei dem jeweils aktuellen Link ändern, nicht seine sonstige Funktionalität.
Welche Funktionalität denn? Ich sehe wie gesagt keine bzw. nur eine, die Verwirrung stiften kann. Und mal ehrlich: findest Du es sinnvoller, den Hand-Cursor hier zu ändern, als das a-Element einfach zu entfernen bzw. durch ein passenderes zu ersetzen?Man muss es eben so wirken lassen, dass es nicht verwirrt ;). Ich fände es durchaus sinnvoll, hier den Hand-Cursor zu "ersetzen", dass ist aber mehr oder weniger Geschmackssache. Weitere Funktionalität stellt nämlich u.a. die strukturierende Wirkung der Links/der Navi an sich dar, die z.B. neben Menschen auch für Maschinen bzw. Software interessant sein kann. Die will da nicht draufklicken und der ist auch egal, wie die Navi aussieht, für die sind die Verknüpfungen relevant.
Gerade semantisch ist es also sinnvoll, den Punkt als Link zu lassen, ein Unterschied muss hier eher in der Semiotik gemacht werden :).
Ich sehe keinen semantischen Sinn in einem nutzlosen Element - im Gegenteil.Wie gesagt, nutzlos wird es dadurch m.E. nicht. Aber ich glaube, da könnten wir noch ein paar Stunden drüber philosophieren ;)
Grüße :)
Mirko
-
Hi,
Ein Link ist zunächst mal, sagen wir mal eine "Technik", um eine Art Struktur/Zusammenhang zwischen z.B. Dokumenten aller möglichen Art zu definieren oder zu "erzeugen". Dass man so ausgezeichnete Elemente anklicken kann, ist eine komfortable Erscheinung für den Menschen, der sich mit den so strukturierten Daten befasst.
Nein, das ist das Grundprinzip von HTML - das H steht für "Hypertext" und bedeutet, daß Dokumente über Verweise miteinander vernetzt werden können. Aber was soll da eine Vernetzung mit sich selbst?
Weitere Funktionalität stellt nämlich u.a. die strukturierende Wirkung der Links/der Navi an sich dar, die z.B. neben Menschen auch für Maschinen bzw. Software interessant sein kann. Die will da nicht draufklicken und der ist auch egal, wie die Navi aussieht, für die sind die Verknüpfungen relevant.
Eine Verknüpfung zu der Seite, die gerade aufgerufen wurde? Wieso sollte die für igrend jemand oder etwas interessant sein? Und was die Struktur betrifft: Wenn Du debn aktuellen Menüpunkt strukturell hervorheben willst, wäre strong alleine völlig ausreichend.
Ich sehe keinen semantischen Sinn in einem nutzlosen Element - im Gegenteil.
Wie gesagt, nutzlos wird es dadurch m.E. nicht. Aber ich glaube, da könnten wir noch ein paar Stunden drüber philosophieren ;)
nunja, so langsam gehen mir auch die Ideen aus, wie ich Dir das klarmachen könnte.
freundliche Grüße
Ingo
-
-
Hallo.
Ich sehe keinen semantischen Sinn in einem nutzlosen Element - im Gegenteil.
SIehst du denn einen nicht-semantischen Sinn? Vieleicht gar einen übersinnlichen?
MfG, at
-
-
Hallo.
Gerade semantisch ist es also sinnvoll, den Punkt als Link zu lassen, ein Unterschied muss hier eher in der Semiotik gemacht werden :).
Als Fachmann solltest du wissen, dass die Semantik ein Teil der Semiotik ist, ebenso wie die Syntaktik, die Sigmatik und die Pragmatik. Im Übrigen sind sinnvolle Sachverhalte immer nur semantisch sinnvoll; in den anderen Teilbereichen der Semiotik sind sie allenfalls korrekt.
MfG, at
-
-
-
-
-
-
-
Hi,
deine Beschreibung von dem speziellen div ist mir nicht ganz klar.also ich setze um den link ein <strong>:
<strong><a href="galerie.htm" target="_parent" >Galerie</a></strong>was muss dann hinter "a:" stehen??:
.strong a:current {color:#000000;}bzw. wie definiere ich dann eine Klasse für current?
viele Grüße Miriam
-
Hi,
deine Beschreibung von dem speziellen div ist mir nicht ganz klar.Zunächst mal als Tip:CSS-Syntax lernen ;)
Der Doppelpunkt ist m.E. nur für Pseudoklassen, also Subklassen von Elementen, welche schon vom Browser gekannt werden (bei dem ienen weniger, bei dem anderen mehr ;). Die (Dir) Bekannteste dürfte :hover sein.
Der Punkt wird benutzt, wenn man eigene Klassen definiert. Diese referenziert man dann über das class-Attribut im HTML-Tag.
z.B.
<style>
a.current {font-weight:bold}
</style>
...
<body>
<a href="1.html">1</a>
<a href="2.html" class="current">2</a>
</body>Strong hingegen ist ein Tag, obwohl vielleicht auch eine Klasse so nennen könnte. Das :current macht darüber hinaus keinen Sinn.
Syntax wäre also wie in meinem obigen Beispiel, oder indem Du für nicht-in-Klassen-eingeordnete Tags einen Style definierst, indem Du Dich auf die Art ihrer Verschachtelung beziehst:
strong a {font-weight:bold}
Obiges bezieht sich auf alle a's, die zwischen strong's eingebunden sind.
Mirko
-
Hi Mirko,
ok, also angenommen ich weise allen Menüpunkten die class="current" zu.wie kann ich dann in einem JavaScript definieren, dass, sobald diese Seite geöffnet vorliegt, die class="current" auch wirklich zum Einsatz kommt und alle anderen "passiven" Links nicht davon beeinflusst werden?
viele Grüße
Miriam-
Hallo,
ok, also angenommen ich weise allen Menüpunkten die class="current" zu.
Ich glaube, es sind noch nicht alle Missverständnisse aus dem Weg geräumt:
Die Klasse "current" war, wie der Name schon nahelegt, nur und zwar genau nur für den Link gedacht, der auf die aktuelle Seite verweist (im Übrigen gibt es aber andere Meinungen über die sinnvolle Auszeichnung der aktuellen Seite in der Navi, wie Du dem Thread entnehmen kannst ;).
Wenn Du leider das Problem hast, dass die Navi nicht mit der Seite neu geladen wird, müsstest Du z.B. jedem Menüpunkt eine eigene ID geben und per JS (mit document.getElementByID(...)) eben dieses Element ansprechen und über das style-Objekt dessen Aussehen ändern. Das geht entweder per Klassenzuweisung oder durch das direkte Ändern einzelner Eigenschaften.
Mirko
-
Hi Mirko,
danke ich probiere mal aus, jedem Menüpunkt ein stylesheet zuzuweisen. vielleicht funktioniert es ja dann.
das Menü wird übrigens auch jedesmal neu geladen:target="_parent"
vielen Dank für deine umfangreiche Hilfe
Miriam
-
-
-
Hallo.
Zunächst mal als Tip:CSS-Syntax lernen ;)
Gute Idee.
Der Doppelpunkt ist m.E. nur für Pseudoklassen, also Subklassen von Elementen, welche schon vom Browser gekannt werden (bei dem ienen weniger, bei dem anderen mehr ;).
Dein Erachten ist hier leider nicht deckungsgleich mit den Tatsachen, denn außer den Pseudoklassen kann der Doppelpunkt auch auf Pseudoelemente hindeuten.
MfG, at
-
-
-