[JS] Zmiana koloru menu po kliknięciu

0

Witam,

Mam taki kod:

<script type="text/javascript">
<!--
function koloruj(t){
var t = document.getElementById("tekscik");
t.setAttribute('color','red');
}
//-->
</script>
<font id="tekscik">ZMIEŃ NA CZERWONY</font>
<INPUT TYPE=button onClick="koloruj()" value="Koloruj na czerwono"/>

I chcę zrobić na stronie coś takiego, że mam niebieskie nagłówki menu, a na dole jest tekst np.
"wybierz kolor nagłówków menu: pomarańczowy, czerwony, żółty, zielony, standardowy (niebieski)"?
Po kliknięciu na jeden z kolorów nagłówki menu dynamicznie zmieniają sie na podany kolor (tak jak w skrypcie).
Tyle, że w skrypcie zmiana jest na jeden kolor, a ja nie umiem zrobić tak, żeby było więcej niż jeden kolor.

Pozdrawiam i dziękuję ;)

0
function koloruj(t){
var t = document.getElementById("tekscik");
t.setAttribute('color',t);
}

wywolujesz np. koloruj('red')

0

Maly przyklad:

<script>
  function getElements(parent, tag, _class) {
    if (! parent) parent = document;
    if (typeof tag != 'string' || tag == '') tag = '*';
    if (typeof _class != 'string' || _class == '') _class = '.*';
    var ar = parent.getElementsByTagName(tag), res = [];
    var reg = new RegExp('(^|\\s)' + _class + '($|\\s)', '');
    for (var i = 0; i < ar.length; i++) 
      if (ar[i].className.match(reg)) res[res.length] = ar[i];
    return res;
  }
  function setColor(col) {
    var ar = getElements(0, 0, 'nag_menu'), i = 0;
    while (i < ar.length) ar[i++].style.color = col;
  }
</script>
<style>
  .nag_menu { color: blue; }
</style>
<h3 class="nag_menu">Nagłowek 1</h3>bla bla bla...
<h3 class="nag_menu">Nagłowek 2</h3>bla bla bla...
<h3 class="nag_menu">Nagłowek 3</h3>bla bla bla...
<p>Wybierz kolor nagłówków menu: 
  <a href="javascript:setColor('orange')">pomarańczowy</a>, 
  <a href="javascript:setColor('red')">czerwony</a>, 
  <a href="javascript:setColor('yellow')">żółty</a>, 
  <a href="javascript:setColor('green')">zielony</a>, 
  <a href="javascript:setColor('blue')">niebieski</a>.
</p>

Przy pomocy funkcji getElements mozesz wydobyc elementy po nazwie tagu, klasy lub obu naraz.

0

Wielkie dzięki ;).

1 użytkowników online, w tym zalogowanych: 0, gości: 1