FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter

Zur Registrierung

Thema: Zustand "focus" on load vom 21.03.2011

	MGi Foren-Übersicht -> Programmierung -> Zustand "focus" on load
	Seite: Zurück 1, 2, 3

Autor

Nachricht

bacon

Dabei seit: 24.10.2007
Ort: -
Alter: -
Geschlecht: -

Verfasst Mi 23.03.2011 11:30
Titel

Zitat:

Unobtrusive wäre, das href-Attribut mit Javascript umzuschreiben. Und dabei würde ich sehr wohl auf void statt auf Anker setzen

Ebenfalls Murks.

Wenn schon, dann mit den gängigen Methoden/Workarounds DOMEvent.preventDefault() bzw. DOMEvent.stopPropagation() arbeiten (die nativ nicht cross-browser-fähig zur Verfügung stehen).

Der Inhalt des href-Attributs des Ankers bleibt im DOM-Tree stehen und kann zur Ziel-Element-Adressierung genutzt werden. Klassisches Anwendungs-Beispiel Accordion.

Zitat:

Und inline-Code-Attribute ist jetzt auch nicht gerade unobtrusive..

Richtig. Diese sind generell zu vermeiden (Stichwort separation of concerns)

Zuletzt bearbeitet von bacon am Mi 23.03.2011 11:31, insgesamt 1-mal bearbeitet

choise

Dabei seit: 01.02.2007
Ort: Würzburg
Alter: 35
Geschlecht: Männlich

Verfasst Mi 23.03.2011 11:46
Titel

script nochmal angepasst, damit die links auch zum content bezug haben über anker: http://jsfiddle.net/zgPtM/2/

Code:

$(function(){

// element
var $boxes = $('.box');
var $links = $('a');

// verstecken
$boxes.hide();

// klick auf links "beobachten"
$links.click(function(e){

// normalen link deaktivieren
e.preventDefault();

// cache n active
var $this = $(this);
$links.removeClass('active');
$this.addClass('active');

// Attribut href auslesen
var id = $this.attr('href');

// Nochmals alle Boxen verstecken
$boxes.hide();

// Box mit Klasse == REL anzeigen
$(id).show();

});

})

Code:

<a href="#b1">Box 1</a>
<a href="#b2">Box 2</a>
<a href="#b3">Box 3</a>

<div id="b1" class="box">Lorem ipsum Box1</div>
<div id="b2" class="box">Ipsem dolor Box2</div>
<div id="b3" class="box">Sit amet Box3</div>

Zuletzt bearbeitet von choise am Mi 23.03.2011 11:47, insgesamt 1-mal bearbeitet

	Seite: Zurück 1, 2, 3
	MGi Foren-Übersicht -> Programmierung

Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst an Umfragen in diesem Forum nicht mitmachen.