CSS bei onclick ändern

[Dustin84]

Hallo,

ich habe hier einen Link (Infoicon):

<a href="#'.$j.'" onclick="this.style.backgroundPosition = "0px -15px;" class="infoicon"><img src="/_standards/bilder/pixel.gif" width="15" height="15" alt="Mehr Informationen" title="Mehr Informationen" border="0"></a>

Beim klicken soll nun die Hintergrundgrafik um 15px verschoben werden, um das Icon auf aktiv zu setzen. Alternativ würde auch das ändern der Klasse in "infoiconaktiv" helfen.

So wie ich es nun probiert habe funktioniert es nicht.

Syntaxfehler oder bin ich komplett auf'n Holzweg?

Gruß D.

 

[Maik]

Moin,

wohin soll das Hintergrundbild verschoben werden? Nach links oder oben?

Der erste Wert steht für die horizontale, der zweite für die vertikale Position.

• Zitat-Quelle: http://de.selfhtml.org/css/eigenschaften/hintergrund.htm#background_position

Und existiert dort überhaupt ein Hintergrundbild? Das <img>-Element ist nämlich keines.

mfg Maik

 

[Dustin84]

In der Klasse "infoicon" gibts ein Hintergrundbild. Ich habe auf das Icon schon ein Hover, was auch funktioniert.

 

[Maik]

http://www.tutorials.de/forum/javascript-ajax/356868-denkfehler.html#post1848790 - ab hier das Thema weiterlesen bis Post #8.

mfg Maik

 

[Dustin84]

hm, also ich habs ein wenig anders fast zum laufen bekommen.

Link auf Infoicon:
$j ist der counter, da ich viele Icons habe.

<a href="#" id="icon_'.$j.'" onclick="infoicon('.$j.')" class="infoicon"><img src="/_standards/bilder/pixel.gif" width="15" height="15" alt="Mehr Informationen" title="Mehr Informationen" border="0"></a>

Darunter dann das Javascript:

		// FUNKTION Infoicon Aktiv bzw. Inaktiv setzen
		function infoicon(nummer) {  
			<? for ($zaehlerInfoicon = 0; $zaehlerInfoicon < 30; $zaehlerInfoicon++) { ?>
				document.getElementById('icon_<? echo $zaehlerInfoicon; ?>').style.backgroundPosition = "0px 0px"; // Alle Icons deaktivieren
				document.getElementById('icon_'nummer').style.backgroundPosition = "0px -15px"; // Geklickte Icon aktivieren
			<? } ?>
		}

Das Problem ist die falsche Syntax. Wie binde ich den übergebenen Wert nummer bei getElementById ein, so dass hinterher ('icon_9') im Quelltext steht?

Gruß
D.