Daca tot am facut un tutorial despre cum sa deschidem ferestre folosind Javascript , m-am gandit ca un tutorial despre cum sa le centram pe ecranul vizitatorului ar fi bine venit .
O sa facem doua butoane, pentru a deschide si inchide popup-ul , acestor butoane le adaugam eventul onClick pentru a chema functia Javascript care inchide si deschide fereastra :
<input type="button" onClick="Deschide();" value="Deschide Fereastra"><br/> <input type="button" onClick="Inchide();" value="Inchide Fereastra">
Dupa cum bine stiti ( sau nu :P ) , Javascript se executa in browser-ul vizitatorului, avand in vedere ca noi dorim ca fereastra noastra sa apara centrata pe monitorul fiecarui user, cu javascript o sa reusim sa facem acest lucru.Este chiar foarte simplu.
Dupa ce aflam latimea si inaltimea ecranului folosind screen.width si screen.height scadem latimea si inaltimea actuala a ferestrei facuta de noi dupa care impartim la 2 :
<script type="text/javascript" > // www.rotuts.com Tutoriale si resurse web var fereastra = null; var x = (screen.width -700) /2; // scadem 700 (latimea ferestrei ) din valoarea latimii a ecranului , dupa care impartim la 2 var y = (screen.height -400) /2; // scadem 400 (inaltimea ferestrei ) din valoarea inaltimii a ecranului , dupa care impartim la 2 function Deschide(){ fereastra = window.open("http://www.rotuts.com/","Rotuts","width=700,height=400"); fereastra.moveTo(x,y); // mutam fereastra la coordonatele obtinute fereastra.focus(); // focalizam fereastra } function Inchide(){ if(fereastra != null) // daca variabila fereastra NU este goala ( null ) atunci inseamna ca fereastra este deschisa , deci trebuie sa o inchidem. { fereastra.close() fereastra = null; } } </script>
Folosind moveTo reusim sa mutam fereastra la coordonatele obtinute in urma calcularii inaltimii si latimii.
Da si tu un like
Tweet
Daca ti-a fost folositor acest tutorial/articol, poti copia urmatorul cod pe pagina ta
Comenturi
0 comenturi pana acum... (posteaza si tu)