✔ a:active bleibt nich aktiv

T

TobyColonia

Grünschnabel
Tach zusamme, ich habe ein problem.

Ich habe eine Seite mit 3 Frames. Menu, main, top......nun soll eben der link im menu active bleiben, auch wenn man woanders hin klickt auf der seite! Weil bei mir verschwindet die active-markierung sobald man woanders hinklickt!

Waere nett wenn mir einer helfen koennte!

CSS-Code:

Code: 
<style>
a:hover{color:#000000;text-decoration:none; font-size: 12px;
background-color:#EFEFEF;
border-top:solid 1px #F88D33;
border-bottom:solid 1px #F88D33;
}

a:active {
background-color:#EFEFEF;
border-top:solid 1px #F88D33;
border-bottom:solid 1px #F88D33;
color: #990000;
}

a {
font-family: Arial, Helvetica, sans-serif; text-decoration:none;}
</style>
 
Dann schauen wir doch mal kurz in die Spezifikation, was die dazu sagt:
http://www.edition-w3c.de/TR/1998/REC-CSS2-19980512/kap05.html#heading-5.11.3%A0 hat gesagt.:
Die Pseudo-Klasse :active gilt, während ein Element vom Benutzer aktiviert wird. Beispielsweise könnte das zwischen den Zeitpunkten sein, wo der Benutzer die Maustaste drückt und sie wieder loslässt.
Zum Vergrößern anklicken....
Somit ist diese Pseudoklasse dafür nicht geeignet.
 
ach ist :active dann nur zustaendig fuer die Aktion wenn man klickt.... Aber bei Firefox behaelt der link auch die formatierung, solange man jedoch nirgendwo anders auf der seite hinklickt!

die frage stell ich dann anders: Wie bekommt man das denn dann hin? Java?
 
Zuletzt bearbeitet:
Probier mal Folgendes:
Code: 
function addClass( obj, _className)
{
	return ( obj.className += " " + _className );
}
function removeClass( obj, _className)
{
	var regExp = new RegExp("\s*" + _className + "\s*");
	return ( obj.className = obj.className.replace(regExp, "") );
}
function setActive() {
	var aElements = document.getElementsByTagName("a");
	for(var i=0; i<aElements.length; i++) {
		removeClass(aElements[i], "a-active");
		aElements[i].onclick = new Function("setActive(this)");
	}
	for(var i=0; i<setActive.arguments.length; i++ ) {
		addClass(setActive.arguments[i], "a-active");
	}
}
window.onload = function() {
	setActive();
}
Die zusätzliche Klasse heißt hierbei „a-active“.
 
hmmmm.........wird mir jetzt aber zu kompliziert......also ich baue den obenstehenden text dann zwischen <script type="text/javascript"> und </script> in den body ein oder Da passiert dann mal garnichts anderes als sonst auch wenn ich die seite oeffne!
 
Also Folgendes funktioniert bei mir wunderbar:
HTML: 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
	<title></title>
	<script type="text/javascript"><!--
		function addClass( obj, _className)
		{
			return ( obj.className += " " + _className );
		}
		function removeClass( obj, _className)
		{
			var regExp = new RegExp("\s*" + _className + "\s*");
			return ( obj.className = obj.className.replace(regExp, "") );
		}
		function setActive() {
			var aElements = document.getElementsByTagName("a");
			for(var i=0; i<aElements.length; i++) {
				removeClass(aElements[i], "a-active");
				aElements[i].onclick = new Function("setActive(this)");
			}
			for(var i=0; i<setActive.arguments.length; i++ ) {
				addClass(setActive.arguments[i], "a-active");
			}
		}
		window.onload = function() {
			setActive();
		}
		//-->
	</script>
	<style type="text/css">
		.a-active {
			background-color: #fe0;
		}
	</style>
</head>

<body>
	<p><a href="#">foobar</a> <a href="#">foobar</a> <a href="#">foobar</a> <a href="#">foobar</a> <a href="#">foobar</a></p>
</body>
</html>
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück