Zdravim. Mam 5 tlacidiel a pod nimi jeden text. 3 tlacidla menia farbu textu, stvrte da textu border a piate border zrusi. Chcem ale aby stvrte tlacidlo plnilo takuto funkciu:
ked je nastavena napr. cervena farba textu a kliknem na border tlacidlo, text musi dostat hranicu takej farby akej je on sam a to pre vsetky 3 farby... Nejak som to nakodil ale ocividne nefungiruje.
Prosim ak niekto vie ako to rozbehat odpovedzte mi funkcnym kodom a vysvetlenim. Dakujem vopred
html:
Kód:
<input type="button" value="Red" id="butty1"/>
<input type="button" value="Blue" id="butty2"/>
<input type="button" value="Green" id="butty3"/>
<input type="button" value="Border" id="butty_border"/>
<input type="button" value="Border_off" id="butty_border_off"/>
<p id="text">This is some text.</p>
js:
Kód:
function main(){
x = document.getElementById('butty1');
xx = document.getElementById('butty2');
xxx = document.getElementById('butty3');
but_bord = document.getElementById('butty_border');
but_bord_off = document.getElementById('butty_border_off');
y = document.getElementById('text');
x.addEventListener('click', function changeToRed(){y.style.color='red';}, false);
xx.addEventListener('click', function changeToBlue(){y.style.color="blue";}, false);
xxx.addEventListener('click', function changeToYellow(){y.style.color="green";},false);
but_bord.addEventListener('click', makeBorder, false);
but_bord_off.addEventListener('click', function BorderOff(){y.style.border="0px solid red";},false);
}
function makeBorder(){
if(x.clicked==true){
y.style.border="2px solid red";
y.style.width="200px";
}
else if(xx.clicked==true){
y.style.border="2px solid blue";
y.style.width="200px";
}
else if(xxx.clicked==true){
y.style.border="2px solid yellow";
y.style.width="200px";
}
}
window.addEventListener('load', main, false);
