✔ CSS-Stil dynamisch ändern

[Flextone]

Holla die Waldfee. Brauch ich denn noch andere Sachen oder nur diese eine Zeile?

 

[Gumbo]

Um es noch endgültig klarzustellen: JavaScript hat absolut nichts mit Java zu tun!

 

[Flextone]

Ich verstehe nicht was diese eine Zeile genau bewirken soll.

Es ist ja standardmäßig so:

<div class="rowback">bla</div>

wie kann ich das nun bei mouseklick auf dieser Zeile

<div class="rowback_sel">blub</div>

zu bekommen.

Sorry aber ich verstehe es echt nicht.

 

[Maik]

Probier es doch mal so:

<div class="rowback" onmousedown="this.className='rowback_sel'" onmouseup="this.className='rowback'">blablub</div>

 

[Flextone]

Es geht. AAAh super!

Kann man auch folgendes daraus machen:

Ich klicke und die Klasse ändert sich und bleibt stehen (also makiert) danach klick ich nochmal um die Klasse wieder zu löschen.

 

[Maik]

<div class="rowback" onclick="this.className='rowback_sel'" ondblclick="this.className='rowback'">blablub</div>

 

[Flextone]

Noch besser

Kann man das DoubleClick in einen Einfach umformen?

Ist ja weniger benutzerfreundlich.

 

[Maik]

In diesem Fall ist eine Scriptfunktion erforderlich, die die beiden Klassennamen tauscht:

<script type="text/javascript">
<!--
function exchange_clName(id) {
    obj = document.getElementsByTagName("div");
    if (obj[id].className == 'rowback_sel'){
    obj[id].className = 'rowback';
    }
    else {
    obj[id].className = 'rowback_sel';
    }
}
//-->
</script>

<div class="rowback" id="test" onclick="exchange_clName('test')">blablub</div>

 

[Flextone]

danke nochmal das du mir darauf geantwortet hast.

NUR wie soll es anders sein, habe ich auch da meine ganz spezielle Frage

1. id="test" muss ich die vergeben? Weil eine id wiederholt eine Validefehler ist und daher würde ich gern drauf verzichten.

Müsste man das eventuell so umformen:

<script type="text/javascript"> 
<!-- 
function exchange_clName(class) { 
obj = document.getElementsByTagName("div"); 
if (obj[id].className == 'rowback_sel'){ 
obj[id].className = 'rowback'; } else { obj[id].className = 'rowback_sel'; } }
 //-->
 </script>

und

<div class="rowback" onclick="exchange_clName('rowback')">blablub</div>

 

[Maik]

Wo ist das Problem?

Du kannst doch jedem DIV (s)eine ID geben:

<div class="rowback" id="test_1" onclick="exchange_clName('test_1')">blablub</div>

<div class="rowback" id="test_2" onclick="exchange_clName('test_2')">blablub</div>

<div class="rowback" id="test_3" onclick="exchange_clName('test_3')">blablub</div>