nicht angemeldet
class ändern Firefox geht / IExplorer teilweise
Hallo,
habe links nach diesen Schema:
<a href="javascript:tabbed_selected('tab_1',true);" id="tab_1" class="tab_selected" onmouseover="tabbed_selected('tab_1',false);">Name</a>
Hier mal das Script dazu:
function tabbed_selected(tab_id,click) {
document.getElementById('tab_1').className = 'tab_unselected';
document.getElementById('tab_2').className = 'tab_unselected';
document.getElementById('tab_3').className = 'tab_unselected';
document.getElementById('tab_4').className = 'tab_unselected';
if (tab_id == 'tab_1') {
document.getElementById('tab_1').className = 'tab_selected';
if (click == true) {
//load_tab_content(tab_id);
}
}
if (tab_id == 'tab_2') {
document.getElementById('tab_2').className = 'tab_selected';
if (click == true) {
//load_tab_content(tab_id);
}
}
if (tab_id == 'tab_3') {
document.getElementById('tab_3').className = 'tab_selected';
if (click == true) {
//load_tab_content(tab_id);
}
}
if (tab_id == 'tab_4') {
document.getElementById('tab_4').className = 'tab_selected';
if (click == true) {
//load_tab_content(tab_id);
}
}
}
Das funktioniert im Firefox gut im Iexplorer ist Mouseover auch kein Problem sobald ich aber den Link klicke scheint er die Css klasse nicht einzubinden, jedenfals ist der komplette Link dann weiß ....
Kann sich einer erklären woran das liegt ?
-
Hi,
<a href="javascript:tabbed_selected('tab_1',true);" id="tab_1" class="tab_selected" onmouseover="tabbed_selected('tab_1',false);">Name</a>
woher kommt eigentlich diese Unsitte, immer alles über IDs abfrühstücken zu müssen? Du befindest Dich bereits in genau dem Element, das Du verändern möchtest. Übergib das Element, nicht seinen Namen, mit dem das Element dann erst wieder umständlich gesucht werden muss!
if (tab_id == 'tab_1') {
document.getElementById('tab_1').className = 'tab_selected';Irgendwas irritiert mich hier.
if (tab_id == 'tab_2') {
document.getElementById('tab_2').className = 'tab_selected';Irgendwas irritiert mich hier.
if (tab_id == 'tab_3') {
document.getElementById('tab_3').className = 'tab_selected';Irgendwas irritiert mich hier.
if (tab_id == 'tab_4') {
document.getElementById('tab_4').className = 'tab_selected';Irgendwas irritiert mich hier.
Ah, ich weiß auch was: Die Wiederholungen. JavaScript ist nicht das Deutsche Fernsehen.
Das funktioniert im Firefox gut im Iexplorer ist Mouseover auch kein Problem sobald ich aber den Link klicke scheint er die Css klasse
HTML-Klasse.
nicht einzubinden, jedenfals ist der komplette Link dann weiß ....
Kann sich einer erklären woran das liegt ?
Ich würde in erster Linie mal darauf verzichten, das Dokument zu vernichten zu versuchen, um es anschließend doch nur zu verändern. Das <a>-Element dient der Verlinkung von Ressourcen; verlinke also entweder Ressourcen oder verzichte auf das <a>-Element. In jedem Fall ist die javascript:-URL definitiv fehl am Platz.
Cheatah
--
X-Self-Code: sh:( fo:} ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
X-Will-Answer-Email: No
X-Please-Search-Archive-First: Absolutely Yes-
Hi,
danke für die Antwort erstmal. Jetzt stellt sich mir nur die Frage wie ich es aufbaue das es funktioniert?!
Was meinst du mit "In jedem Fall ist die javascript:-URL definitiv fehl am Platz." ?Gruß
Alex-
Hi Alex!
Also, ich denke, dass du es idealerweise so aufbauen könntest:
http://de.selfhtml.org/css/eigenschaften/pseudoformate.htm#link_visited_focus_hover_active
Anstatt die CSS Klasse des <a> Elements zu ändern, gibst du einfach die entsprechende CSS Fromatierung zur jeweiligen Pseudoklasse an.Und mit "javascript:-URL definitiv fehl am Platz" meint cheatah imho, dass im href attribut deines <a> tags kein ="javascript:..." stehen soll, sondern ein echter Verweis.
Viele Grüße,
Richard-
Hi,
Und mit "javascript:-URL definitiv fehl am Platz" meint cheatah imho, dass im href attribut deines <a> tags kein ="javascript:..." stehen soll, sondern ein echter Verweis.
... und/oder eine JavaScript-Funktionalität, die auf Klick ausgeführt werden soll, per onclick-Handler angegeben wird.
Cheatah
--
X-Self-Code: sh:( fo:} ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
X-Will-Answer-Email: No
X-Please-Search-Archive-First: Absolutely Yes -
Hallo,
ich sollte vielleicht mal die komplette Anwendung beschreiben denn ich hätte es auch lieber anders gemacht bin dann aber in der schnelle auf keine andere Lösung gekommen.
Es handelt sich um ein Tabbed Menü das aus vier Links besteht:
Link | Link2 | Link3 | Link4
Darunter schließt sich ein DIV an das dann den Inhalt aufnimmt. Dabei entstehen auch Scrollbars.Nun habe ich mir überlegt das es so zu lösen wäre das ich ein Mouseovereffekt mache und sobald ein Link angeklickt wird ( In meinem Fall ruft er dann z.B. href="Javascript:tabbed_selected('tab_1',true)" auf. Er sollte dann die Klasse ändern das der Button hat in der Farbe bleibt und den Content dynamisch nachladen für das Div. Klappt auch soweit alles. Nun hatte ich anfang auch ein onclick drin um die Function aufzurufen und als href="#" dann sprint er aber auf den Seitenanfang was scheiße ist denn es soll sich ja nix bewegen auf der Seite.
Jo und so bin ich dann zu dieser "komischen" Konstruktion gekommen
Alex
-
Hi Alex!
Wie immer gilt: Du darfst natürlich deine Seite realisieren, wie du möchtest (man kann auch viel bei sowas lernen) - jedoch werden dir die allermeisten Leute hier aus dem Forum gerne bestätigen, dass ein Menü, welches Javascript benötigt und eines semantischen Aufbaus entbehrt, eine suboptimale Lösung ist.
Warum willst du das Rad neu erfinden? Für mich klingt es als würdest du nach Lösungen wie diesen suchen (Achtung: bei kommerzieller Verwendung, Bedingung beachten, siehe suffix):
http://www.grc.com/menu2/invitro.htm-public domain
donation: http://www.cssplay.co.uk/menus/dd_valid.html-donation
http://www.tjkdesign.com/articles/keyboard_friendly_dropdown_menu/default.asp-cc licensedGrüsse,
Richard-
Hi,
ne was ich genau gebaut habe ist:
http://www.dynamicdrive.com/dynamicindex17/ajaxtabscontent/index.htmich hatte ursprünglich das Menü benutzt und es funktionierte wirklich wunderbar hatte aber zwei vorteile das ich es nicht weiter verwenden konnte:
a) wenn man einen anderen Link auf der Seite geklickt hat und die Seite neu geladen wurde ist das Menü lögischerweise auf den ersten Reiter zurück gesprungen. Auwahl sollte aber erhalten bleiben...
b) Wenn man sich schon unter irgendeinem Reiter gescrollt hat und zb.Link 200 geklickt hat passiert natürlich das selbst wie bei a) und es setzte Scroll top auf 0 bzw. dadruch das die Seite neu geladen wurde ging das vorloren.
Ich sah nur die Möglichkeit den Rest der Seite ebenfalls per Ajax nachzuladen was ich nicht wollte wegen fehlender Möglichkeit zurückzusprungen am Browser
Jo so bin ich dann hier geladen ...
-
Hi Alex!
Wieso baust du die Seite denn nicht ohne Einsatz von JavaScript?
Ich sah nur die Möglichkeit den Rest der Seite ebenfalls per Ajax nachzuladen was ich nicht wollte wegen fehlender Möglichkeit zurückzusprungen am Browser
Auch das kann man mit Ajax realisieren. Zumindest behauptet das das Buch, das ich zu Hause wegen Inpraktikabilität in die Ecke gepfeffert habe.
MfG H☼psel
--
"It's amazing I won. I was running against peace, prosperity, and incumbency."
George W. Bush speaking to Swedish Prime Minister unaware a live television camera was still rolling, June 14, 2001
Selfcode: ie:% fl:( br:> va:) ls:& fo:) rl:? n4:& ss:| de:] js:| ch:? sh:( mo:) zu:)
-
-
-
Hi,
Nun habe ich mir überlegt das es so zu lösen wäre das ich ein Mouseovereffekt mache und sobald ein Link angeklickt wird ( In meinem Fall ruft er dann z.B. href="Javascript:tabbed_selected('tab_1',true)" auf. Er sollte dann die Klasse ändern das der Button hat in der Farbe bleibt und den Content dynamisch nachladen für das Div. Klappt auch soweit alles. Nun hatte ich anfang auch ein onclick drin um die Function aufzurufen und als href="#" dann sprint er aber auf den Seitenanfang was scheiße ist denn es soll sich ja nix bewegen auf der Seite.
warum benutzt Du an dieser Stelle einen Link?
Cheatah
--
X-Self-Code: sh:( fo:} ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
X-Will-Answer-Email: No
X-Please-Search-Archive-First: Absolutely Yes -
Hallo,
Nun hatte ich anfang auch ein onclick drin um die Function aufzurufen und als href="#" dann sprint er aber auf den Seitenanfang was scheiße ist denn es soll sich ja nix bewegen auf der Seite.
Dann fehlt ein return false; am Ende der Handler-Funktion bzw. des onclick-Attributes. Das unterdrückt die Standard-Ereignis-Behandlung. Bei einem Klick auf einen Link ist das logischerweise, dass die im href angegebene URI angesprungen wird.
Aber es ist tatsächlich egal, ob du <a href="#" onclick="..."> oder <a href="javascript:..."> schreibst, beides funktioniert nur mit JavaScript.
Mathias
-
-
-
-
Hallo,
Das <a>-Element dient der Verlinkung von Ressourcen; verlinke also entweder Ressourcen oder verzichte auf das <a>-Element. In jedem Fall ist die javascript:-URL definitiv fehl am Platz.
Das ist deine Meinung, man kann anderer Meinung sein. (Ich werde nicht müde, es zu betonen.)
Mathias
-
-
Hallo,
Das funktioniert im Firefox gut im Iexplorer ist Mouseover auch kein Problem sobald ich aber den Link klicke scheint er die Css klasse nicht einzubinden, jedenfals ist der komplette Link dann weiß ....
Keine Ahnung, warum der IE die Klasse nicht korrekt anwendet. Hört sich eher nach CSS-Problemen an. Hast du das CSS mal validiert?
Überhaupt kannst du die Mouseover-Logik komplett mit CSS umsetzen. Warum nutzt du dafür JavaScript? Du gibst einem übergeordneten Element eine Klasse oder ID, dann kannst du #menu a { ... } und #menu a:hover { ... } notieren. Oder wozu muss das Element die Klasse tab_selected bekommen?
Das JavaScript kannst du dann z.B. auf folgendes kürzen:
<a href="javascript:load_tab_content('tab_1');">Tab 1</a>
Mathias