Fenetre de login

Description

une fenetre de login il ne manque que la gestion du login et du passe le js et le CSS sont sépare du html la position de la fenetre s'adapte au redimensionnement et au scroll compatible ie 6 a 8 ff opera safarie chrome
++

Source / Exemple :


//-------------------------------------------------------------
//  Nom Document : voile login
//  Auteur       : kazma (kamel A)
//  Objet        : voile login   http://www.javascriptfr.com/
//  Création     :18.06.2009
//-------------------------------------------------------------
//  Mise à Jour  : 09.05.2011
//  Objet        : mise a jour ie 9 et optimisation
//-------------------------------------------------------------
//-(*)------------------

var klog={

regul:0,

quit:function(){
clearInterval(klog.regul);
document.getElementById('divco').parentNode.removeChild(document.getElementById('divco'));
document.getElementById('cadre').parentNode.removeChild(document.getElementById('cadre'));
},

sscro:function(){
var dde=document.documentElement;
var ddl=(navigator.vendor) ? document.body : document.documentElement;
if(parseInt(navigator.userAgent.substring(30,31))<=7){
var dico=document.getElementById('divco');
dico.style.height=dde.clientHeight+ddl.scrollTop+"px";
dico.style.width=dde.clientWidth+ddl.scrollLeft+"px";
}
var adi=document.getElementById('cadre');
adi.style.left=((dde.clientWidth-adi.offsetWidth)/2)+ddl.scrollLeft+'px';
adi.style.top=(dde.clientHeight-adi.offsetHeight)/2+ddl.scrollTop+"px";
},

logdial:function(){

if(arguments.length==0){
klog.creation('div','body','id','divco');
var dico=document.getElementById('divco');
var dde=document.documentElement;
var ddl=(navigator.vendor) ? document.body : document.documentElement;
dico.onclick=klog.quit;
dico.style.height=dde.clientHeight+ddl.scrollTop+"px";
dico.style.width=dde.clientWidth+ddl.scrollLeft+"px";
var hou=0;
}
else{
var hou=arguments[0];
}
if(hou<=0.5){
hou+=0.1;
if(parseInt(navigator.userAgent.substring(30,31))<=8){
document.getElementById('divco').style.filter = 'alpha(opacity='+(hou*50)+')';
} 
else{
document.getElementById('divco').style.opacity=hou;
}
}
else{
klog.boite();
return false
}
setTimeout('klog.logdial('+hou+')',30);
},

raz:function(){
document.getElementById('cadre').getElementsByTagName('input')[0].value='';
document.getElementById('cadre').getElementsByTagName('input')[1].value='';
},

creation:function(elem,parent){
var ddc=(arguments[1]=='body') ? document.body : document.getElementById(parent)

var constrution=document.createElement(elem);
if((arguments.length>2)){
var arle=2
while (arle<arguments.length){

if((arguments[arle]=='txt')){
constrution.appendChild(document.createTextNode(arguments[arle+1]))
}
else if((arguments[arle]=='class')){
constrution.className=arguments[arle+1]
}
else{
constrution.setAttribute(arguments[arle],arguments[arle+1]);
}

arle+=2 
}
}
return ddc.appendChild(constrution)
},

boite:function(){

klog.creation('form','body','id','cadre',"method",'POST','action','index.php');		//la page de redirection//
klog.creation('span','cadre','class','textelog','txt','LOGIN : ');
klog.creation('div','cadre','class','im3').onclick=klog.quit;
klog.creation('input','cadre','name','log','class','log');
klog.creation('input','cadre','name','psw','class','psw','type','password');
klog.creation('span','cadre','class','texpas','txt','MOT DE PASSE :');
klog.creation('div','cadre','id','texte2');
klog.creation('span','texte2','class','txt1','txt','Annuler').onclick=klog.raz;
klog.creation('span','texte2','class','txt2','txt','Ok').onclick=gestion_pass;
klog.regul=setInterval(klog.sscro,50);
}
}

Conclusion :


ping pong tique tongue

Codes Sources

A voir également

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.

Le fait d'être membre vous permet d'avoir des options supplémentaires.