Script1

Scripturi incepatori

SchimbareBackgroundJavascript

mouse over

Coord mouse

Ascunderea unui div atunci cand dam clic pe un link

Pentru asta trebuie ca acel div sa aiba un identificator – sa spundem id=”text” pentru a fi accesat link-ul “ascuns-afisat”

<a onclick=“document.getElementById(‘text’).style.display=(document.getElementById(‘text’).style.display ==  ‘block’) ? ‘none’ : ‘block';”>ascuns-afisat</a>  se foloseste operatorul ? in combinatie cu atribuirea  :      variabila=   conditie ? varianta pentru adevarat : varianta pentru fals adica daca stilul divului text este la un moment dat block atunci el este transformat in none si invers iar variabila ( stilul div-ului) primeste acea valoare

<a href=”#none” onclick=”document.getElementById(‘text’).style.display  =  (document.getElementById(‘text’).style.display ==  ‘block’) ? ‘none’ : ‘block';” >ascuns-afisat</a>
<div id=”text” class=”ascuns” >

text de afisat sau de ascuns

</div>

iar inainte, la inceputul paginii se creaza clasa “ascuns” care seteaza display-ul pe none.
.ascuns
{
display:none;
}

rezultatul il avem aici

ascuns-afisat

text de afisat sau de ascuns

Observatie: 1. Daca il copiati sa va asigurati ca ghilimelele si apostroafele sunt cele acceptate de html. Editorul din wordpress s-ar putea sa le fi schimbat.

2. actiunea din onclick este pusa intre ghilimele onclick=” …” iar in interiorul ghilimelelor se pun apostroafe ex “… display=’block’…” pentru a nu aparea conflicte de notatie

3. onclick-ul de mai sus poate fi scris si asa: onclick=”stil=document.getElementById(‘text’).style; stil.display=(stil.display == ‘block’)?’none':’block';”

si deja avem un bloc java script in care:

mai intai variabila stil devine proprietate style a obiectului div ‘text’ iar apoi se lucreaza doar cu display-ul lui text

o functie ar arata cam asa

<script>

function ascund()

{

stil=document.getElementById(‘text’).style;

stil.display=(stil.display == ‘block’)?’none':’block';

} </script>

iar onclick devine onclick(“ascund()”)