begin process at 2012 05 28 13:34:22
  Trouver un code source :
 
dans
 
Accueil > 

Code

 > 

Frames

 > DIV/LAYER MOBILE COMME UNE FENETRE

DIV/LAYER MOBILE COMME UNE FENETRE


 Information sur la source

Note :
7,6 / 10 - par 5 personnes
7,60 / 10

  • 1

  • 2

  • 3

  • 4

  • 5

  • 6

  • 7

  • 8

  • 9

  • 10
Catégorie :Frames Niveau :Initié Date de création :08/06/2003 Date de mise à jour :08/06/2003 16:29:39 Vu / téléchargé :16 389 / 1 302

Auteur : lumesh

Ecrire un message privé
Site perso
Commentaire sur cette source (6)
Ajouter un commentaire et/ou une note

 Description

J'ai monté ce script  avec plein de bout de code trouver ici et la.
ce script permet de creer une fenetre deplacable avec la souris avec les leyers.
le script est compatible ie4 et + , ns4 et + .

pour deplacer cette fenetre utilisez la barre marron (barre de titre, meme deplaement qu'une fenetre OS).
pour afficher une image dans cette fenetre liquez sur un lien image1.gif ou image2.gif.
pour cacher l'image chargée, cliquez sur O ds la barre de titre (idem pour la faire reaparaitre)

le script n'est pas commenté mais le bloque est tres facilement utilisable pour tout vos sites.
le style de la fenetre est modifiable via du code html assez simplement.

Source

  • <html>
  • <head>
  • <meta http-equiv='content-type' content='text/html; charset=iso-8859-1'>
  • <title>dsdsd</title>
  • <style>
  • <!--
  • .drag {
  • position:relative; cursor:hand
  • }
  • //-->
  • .barre_titre {
  • background-color:#FFFFFF; position:absolute; top:0; left:0;
  • }
  • .barre_contenu {
  • position:absolute; top:30; left:0; background-color:#FFFFFF;
  • }
  • .table_titre {
  • border-width:1px; border-color:rgb(102,102,102); border-style:solid;
  • }
  • .table_contenu {
  • border-width:1px; border-color:rgb(102,102,102); border-style:solid;
  • }
  • </style>
  • <script language='JavaScript'>
  • var dom = (document.getElementById)? true:false;
  • var ns4 = (document.layers)? true:false;
  • var ie4 = (document.all)? true:false;
  • var dd_mode='';
  • function onoffdisplay(){
  • if (ie4) {
  • if (cadre_contenu.style.display=='') cadre_contenu.style.display='none'
  • else cadre_contenu.style.display=''
  • }else if (dom) {
  • if (document.getElementById('cadre_contenu').style.display=='') document.getElementById('cadre_contenu').style.display='none'
  • else document.getElementById('cadre_contenu').style.display=''
  • }else if (ns4) {
  • if (document.layers.cadre_contenu.visibility=='show') document.layers.cadre_contenu.visibility='hide'
  • else document.layers.cadre_contenu.visibility='show'
  • }
  • }
  • function changer_image(ima) {
  • if (ie4) {
  • visual.src=ima;
  • cadre_contenu.style.display=''
  • }else if (dom) {
  • document.getElementById('visual').src=ima;
  • document.getElementById('cadre_contenu').style.display=''
  • }else if (ns4) {
  • document.layers.visual.visibility=ima;
  • document.layers.cadre_contenu.visibility='show'
  • }
  • }
  • function start() {
  • var h=100;
  • if (ie4) {
  • var w=document.body.clientWidth-200;
  • w=50;
  • cadre_barre.style.left=w;
  • cadre_barre.style.top=h;
  • cadre_contenu.style.left=w;
  • cadre_contenu.style.top=h+30;
  • cadre_contenu.style.display='none';
  • cadre_barre.onmousedown=beginDrag;
  • }else if (dom) {
  • var w=window.outerWidth-200;
  • w=0
  • document.getElementById('cadre_barre').style.left=w;
  • document.getElementById('cadre_barre').style.top=h;
  • document.getElementById('cadre_contenu').style.left=w;
  • document.getElementById('cadre_contenu').style.top=h+30;
  • document.getElementById('cadre_contenu').style.display='none';
  • document.getElementById('cadre_barre').addEventListener('mousedown',beginDrag, false);
  • }else if (ns4) {
  • var w=window.outerWidth-200;
  • w=0
  • document.layers.cadre_barre.left=w;
  • document.layers.cadre_barre.top=h;
  • document.layers.cadre_contenu.left=w;
  • document.layers.cadre_contenu.top=h+30;
  • document.layers.cadre_contenu.visibility='hide'
  • document.captureEvents(Event.MOUSEDOWN);
  • document.onmousedown=beginDrag;
  • }
  • }
  • function doDrag(e) {
  • if (ie4) {
  • var difX=event.clientX-window.lastX;
  • var difY=event.clientY-window.lastY;
  • var newX1 = parseInt(cadre_barre.style.left)+difX;
  • var newY1 = parseInt(cadre_barre.style.top)+difY;
  • cadre_barre.style.left=newX1+'px';
  • cadre_barre.style.top=newY1+'px';
  • cadre_contenu.style.left=newX1+'px';
  • cadre_contenu.style.top=newY1+30+'px';
  • window.lastX=event.clientX;
  • window.lastY=event.clientY;
  • }else if (dom) {
  • var difX=e.clientX-window.lastX;
  • var difY=e.clientY-window.lastY;
  • var newX1 = parseInt(document.getElementById('cadre_barre').style.left)+difX;
  • var newY1 = parseInt(document.getElementById('cadre_barre').style.top)+difY;
  • document.getElementById('cadre_barre').style.left=newX1+'px';
  • document.getElementById('cadre_barre').style.top=newY1+'px';
  • document.getElementById('cadre_contenu').style.left=newX1+'px';
  • document.getElementById('cadre_contenu').style.top=newY1+30+'px';
  • window.lastX=e.clientX;
  • window.lastY=e.clientY;
  • }else if (ns4) {
  • var difX=e.pageX-window.lastX;
  • var difY=e.pageY-window.lastY;
  • var newX1 = parseInt(document.layers.cadre_barre.left)+difX;
  • var newY1 = parseInt(document.layers.cadre_barre.top)+difY;
  • document.layers.cadre_barre.left=newX1;
  • document.layers.cadre_barre.top=newY1;
  • document.layers.cadre_contenu.left=newX1;
  • document.layers.cadre_contenu.top=newY1+30;
  • window.lastX=e.pageX;
  • window.lastY=e.pageY;
  • }
  • }
  • function beginDrag(e) {
  • if (ie4) {
  • window.lastX=event.clientX;
  • window.lastY=event.clientY;
  • document.onmousemove=doDrag;
  • document.onmouseup=endDrag;
  • // if (event.srcElement.id=='cadre_barre'){
  • // Récup de l'Id d'un élément sous IE
  • // }
  • }else if (dom) {
  • window.lastX=e.clientX;
  • window.lastY=e.clientY;
  • window.onmousemove=doDrag;
  • window.onmouseup=endDrag;
  • myattr=e.target.getAttribute('ID');
  • // if(myattr=='cadre_barre') {
  • // Récup de l'ID d'un élément sous NS6
  • // }
  • }else if (ns4) {
  • window.lastX=e.pageX;
  • window.lastY=e.pageY;
  • document.captureEvents(Event.MOUSEMOVE)
  • document.onmousemove=doDrag;
  • document.captureEvents(Event.MOUSEUP)
  • document.onmouseup=endDrag;
  • }
  • }
  • function endDrag(e) {
  • if (ie4 || ns4) {
  • document.onmousemove=null;
  • }else if (dom) {
  • window.onmousemove=null;
  • }else if (ns4) {
  • alert('endDrag');
  • document.onmousemove=null;
  • }
  • }
  • </script>
  • </head>
  • <body bgcolor='white' text='black' link='blue' vlink='purple' alink='red' onload='start();'>
  • <p><script language='JavaScript'>
  • var ns4 = (document.layers)? true:false;
  • var ie4 = (document.all)? true:false;
  • var dom = (document.getElementById)? true:false;
  • if ((dom) || (ie4)) {
  • document.write("<div id='cadre_barre' class='barre_titre'><table class='table_titre' cellpadding='5' cellspacing='0' width='310'><tr><th width='275' height='19' valign='middle' nowrap bgcolor='#CC9900'><p>ici pour deplacer la mini fenetre</p></th><th width='15' height='19' valign='middle' nowrap bgcolor='#CC9900'><p><a href='#' onclick='onoffdisplay();'><font color='red'>O</font></a></p></th></tr></table></div>");
  • document.write("<div id='cadre_contenu' class='barre_contenu'><table class='table_contenu' cellpadding='5' cellspacing='0' width='310'><tr><td width='300' height='263' align='center' valign='middle' colspan='2' bgcolor='white'><p><img id='visual' src='' border='0'></p></td></tr></table></div>");
  • } else if (ns4) {
  • document.write("<layer id='cadre_barre' class='barre_titre'><table class='table_titre' cellpadding='5' cellspacing='0' width='310'><tr><th width='275' height='19' valign='middle' nowrap bgcolor='#CC9900'><p>ici pour deplacer la mini fenetre</p></th><th width='15' height='19' valign='middle' nowrap bgcolor='#CC9900'><p><a href='#' onclick='onoffdisplay();'><font color='red'>O</font></a></p></th></tr></table></layer>");
  • document.write("<layer id='cadre_contenu' class='barre_contenu'><table class='table_contenu' cellpadding='5' cellspacing='0' width='310'><tr><td width='300' height='263' align='center' valign='middle' colspan='2' bgcolor='white'><p><img id='visual' src='' border='0'></p></td></tr></table></layer>");
  • }
  • </script>
  • </p>
  • <p><a href="#" onclick="changer_image('1.gif');">image 1 .gif</a></p>
  • <p><a href="#" onclick="changer_image('2.gif');">image 2 .gif</a></p>
  • </body>
  • </html>
<html>

<head>
<meta http-equiv='content-type' content='text/html; charset=iso-8859-1'>
<title>dsdsd</title>

<style>
	<!--
		.drag {
			position:relative; cursor:hand	
		}
	//-->
	.barre_titre {
		background-color:#FFFFFF; position:absolute; top:0; left:0;
	}
	.barre_contenu {
		position:absolute; top:30; left:0; background-color:#FFFFFF;
	}
	.table_titre {
		border-width:1px; border-color:rgb(102,102,102); border-style:solid;
	}
	.table_contenu {
		border-width:1px; border-color:rgb(102,102,102); border-style:solid;
	}
	
</style>

<script language='JavaScript'>
var dom = (document.getElementById)? true:false;
var ns4 = (document.layers)? true:false;
var ie4 = (document.all)? true:false;
var dd_mode='';

function onoffdisplay(){
	if (ie4) {
		if (cadre_contenu.style.display=='') cadre_contenu.style.display='none'
		else cadre_contenu.style.display=''
	}else	if (dom) {
		if (document.getElementById('cadre_contenu').style.display=='') document.getElementById('cadre_contenu').style.display='none' 
		else document.getElementById('cadre_contenu').style.display=''
	}else	if (ns4) {
		if (document.layers.cadre_contenu.visibility=='show') document.layers.cadre_contenu.visibility='hide' 
		else document.layers.cadre_contenu.visibility='show'
	}
}

function changer_image(ima) {
	if (ie4) {
		visual.src=ima;
		cadre_contenu.style.display=''
	}else	if (dom) {
		 document.getElementById('visual').src=ima;
		 document.getElementById('cadre_contenu').style.display=''
	}else	if (ns4) {
		document.layers.visual.visibility=ima;
		document.layers.cadre_contenu.visibility='show'
	}	
}

function start() {
	var h=100;
 	if (ie4) {
		var w=document.body.clientWidth-200;
		w=50;
		cadre_barre.style.left=w;
		cadre_barre.style.top=h;
		cadre_contenu.style.left=w;
		cadre_contenu.style.top=h+30;
		cadre_contenu.style.display='none';
		cadre_barre.onmousedown=beginDrag;
	}else if (dom) {
		var w=window.outerWidth-200;
		w=0
		document.getElementById('cadre_barre').style.left=w;
		document.getElementById('cadre_barre').style.top=h;
		document.getElementById('cadre_contenu').style.left=w;
		document.getElementById('cadre_contenu').style.top=h+30;
		document.getElementById('cadre_contenu').style.display='none';
		document.getElementById('cadre_barre').addEventListener('mousedown',beginDrag, false);
	}else if (ns4) {
		var w=window.outerWidth-200;
		w=0
		document.layers.cadre_barre.left=w;
		document.layers.cadre_barre.top=h;
		document.layers.cadre_contenu.left=w;
		document.layers.cadre_contenu.top=h+30;
		document.layers.cadre_contenu.visibility='hide'
		document.captureEvents(Event.MOUSEDOWN);
		document.onmousedown=beginDrag;
	}
}

function doDrag(e) {
	if (ie4) {
		var difX=event.clientX-window.lastX;
	   var difY=event.clientY-window.lastY;
		var newX1 = parseInt(cadre_barre.style.left)+difX;
	   var newY1 = parseInt(cadre_barre.style.top)+difY;
	   cadre_barre.style.left=newX1+'px';
	   cadre_barre.style.top=newY1+'px';
	   cadre_contenu.style.left=newX1+'px';
	   cadre_contenu.style.top=newY1+30+'px';
	   window.lastX=event.clientX;
	   window.lastY=event.clientY;
	}else if (dom) {
		var difX=e.clientX-window.lastX;
	   var difY=e.clientY-window.lastY;
		var newX1 = parseInt(document.getElementById('cadre_barre').style.left)+difX;
	   var newY1 = parseInt(document.getElementById('cadre_barre').style.top)+difY;
	   document.getElementById('cadre_barre').style.left=newX1+'px';
	   document.getElementById('cadre_barre').style.top=newY1+'px';
	   document.getElementById('cadre_contenu').style.left=newX1+'px';
	   document.getElementById('cadre_contenu').style.top=newY1+30+'px';
	   window.lastX=e.clientX;
	   window.lastY=e.clientY;
	}else if (ns4) {
		var difX=e.pageX-window.lastX;
	   var difY=e.pageY-window.lastY;
		var newX1 = parseInt(document.layers.cadre_barre.left)+difX;
	   var newY1 = parseInt(document.layers.cadre_barre.top)+difY;
	   document.layers.cadre_barre.left=newX1;
	   document.layers.cadre_barre.top=newY1;
	   document.layers.cadre_contenu.left=newX1;
	   document.layers.cadre_contenu.top=newY1+30;
	   window.lastX=e.pageX;
	   window.lastY=e.pageY;
	} 
}

function beginDrag(e) {
	if (ie4) {
		window.lastX=event.clientX;
	   window.lastY=event.clientY;
	   document.onmousemove=doDrag;
	   document.onmouseup=endDrag;
//		if (event.srcElement.id=='cadre_barre'){
//			Récup de l'Id d'un élément sous IE
//		}
	}else if (dom) {
		window.lastX=e.clientX;
	   window.lastY=e.clientY;
	   window.onmousemove=doDrag;
	   window.onmouseup=endDrag;
		myattr=e.target.getAttribute('ID');
//		if(myattr=='cadre_barre') {
//			Récup de l'ID d'un élément sous NS6
//		}
	}else if (ns4) {
		window.lastX=e.pageX;
	   window.lastY=e.pageY;
	   document.captureEvents(Event.MOUSEMOVE)
	   document.onmousemove=doDrag;
	   document.captureEvents(Event.MOUSEUP)
	   document.onmouseup=endDrag;
	}
}

function endDrag(e) {
	 if (ie4 || ns4) {
	 	document.onmousemove=null;
	 }else if (dom) {
		window.onmousemove=null;
	}else if (ns4) {
		alert('endDrag');
		document.onmousemove=null;
	}
}

</script>


</head>

<body bgcolor='white' text='black' link='blue' vlink='purple' alink='red'  onload='start();'>

<p><script language='JavaScript'>
	var ns4 = (document.layers)? true:false;
	var ie4 = (document.all)? true:false;
	var dom = (document.getElementById)? true:false;
	if ((dom) || (ie4)) {
		document.write("<div id='cadre_barre' class='barre_titre'><table class='table_titre' cellpadding='5' cellspacing='0' width='310'><tr><th width='275' height='19' valign='middle' nowrap bgcolor='#CC9900'><p>ici pour deplacer la mini fenetre</p></th><th width='15' height='19' valign='middle' nowrap bgcolor='#CC9900'><p><a href='#' onclick='onoffdisplay();'><font color='red'>O</font></a></p></th></tr></table></div>");
		document.write("<div id='cadre_contenu' class='barre_contenu'><table class='table_contenu' cellpadding='5' cellspacing='0' width='310'><tr><td width='300' height='263' align='center' valign='middle' colspan='2' bgcolor='white'><p><img id='visual' src='' border='0'></p></td></tr></table></div>");
	} else if (ns4) {
		document.write("<layer id='cadre_barre' class='barre_titre'><table class='table_titre' cellpadding='5' cellspacing='0' width='310'><tr><th width='275' height='19' valign='middle' nowrap bgcolor='#CC9900'><p>ici pour deplacer la mini fenetre</p></th><th width='15' height='19' valign='middle' nowrap bgcolor='#CC9900'><p><a href='#' onclick='onoffdisplay();'><font color='red'>O</font></a></p></th></tr></table></layer>");
		document.write("<layer id='cadre_contenu' class='barre_contenu'><table class='table_contenu' cellpadding='5' cellspacing='0' width='310'><tr><td width='300' height='263' align='center' valign='middle' colspan='2' bgcolor='white'><p><img id='visual' src='' border='0'></p></td></tr></table></layer>");
	}
</script>





</p>
<p><a href="#" onclick="changer_image('1.gif');">image 1 .gif</a></p>
<p><a href="#" onclick="changer_image('2.gif');">image 2 .gif</a></p>
</body>

</html>

 Conclusion

un ptit zip est dispo et fonctionnel.
perso jai testé sous IE5 et ns6 et ca marche impec (ce dont je suis plutot content).

voila voilou.
Christophe.

 Fichier Zip

Les Membres Club peuvent télécharger directement un fichier contenu dans le zip sans télécharger le zip en entier !

Télécharger le zip


 Sources du même auteur

Source avec Zip DIV: VRAI FAUSSE FENETRE
MENU DHTML : PAS BIEN SORCIER MAIS PRATIQUE A SAVOIR

 Sources de la même categorie

Source avec Zip Source avec une capture DIAPORAMA SIMPLE PAR IFRAME par sartoz
Source avec une capture CHARGER UNE PAGE WEB DANS UN DIV par flk974
DYNAMIC CONTENT DANS UNE DIV par duterte
INCLUDE EN JAVASCRIPT par yousfane
Source avec Zip PASSER DE FRAMES A UNE PAGE par David78390

Commentaires et avis

Commentaire de ThunderPsycho le 09/06/2003 14:04:10

mouai c pas mal et c fluide, a exploiter... 9/10

Commentaire de Marcial le 06/04/2006 09:23:07

Bon code...
J'ai mis 8 car on sent l'effort et la recherche.
(sinon cela mérite un 7)
J'aurais mis 9/10 si le calque permettant le déplacement avait été dans le calque déplacé...

ce qui aurais donné le code suivant...

<html>
  
<head>
<meta http-equiv='content-type' content='text/html; charset=iso-8859-1'>
<title>dsdsd</title>
  
<style>
    <!--
        .drag {
            position:relative; cursor:hand    
        }
    //-->
    .barre_titre {
        background-color:#FFFFFF; position:absolute; top:0; left:0;
    }
    .barre_contenu {
        position:absolute; top:30; left:0; background-color:#FFFFFF;
    }
    .table_titre {
        border-width:1px; border-color:rgb(102,102,102); border-style:solid;
    }
    .table_contenu {
        border-width:1px; border-color:rgb(102,102,102); border-style:solid;
    }
    
</style>
  
<script language='JavaScript'>
var dom = (document.getElementById)? true:false;
var ns4 = (document.layers)? true:false;
var ie4 = (document.all)? true:false;
var dd_mode='';
  
function onoffdisplay(){
    if (ie4) {
        if (cadre_contenu.style.display=='') cadre_contenu.style.display='none'
        else cadre_contenu.style.display=''
    }else    if (dom) {
        if (document.getElementById('cadre_contenu').style.display=='') document.getElementById('cadre_contenu').style.display='none'
        else document.getElementById('cadre_contenu').style.display=''
    }else    if (ns4) {
        if (document.layers.cadre_contenu.visibility=='show') document.layers.cadre_contenu.visibility='hide'
        else document.layers.cadre_contenu.visibility='show'
    }
}
  
function changer_image(ima) {
    if (ie4) {
        visual.src=ima;
        cadre_contenu.style.display=''
    }else    if (dom) {
         document.getElementById('visual').src=ima;
         document.getElementById('cadre_contenu').style.display=''
    }else    if (ns4) {
        document.layers.visual.visibility=ima;
        document.layers.cadre_contenu.visibility='show'
    }    
}
  
function start() {
    var h=100;
     if (ie4) {
        var w=document.body.clientWidth-200;
        w=50;
        cadre_barre.style.left=w;
        cadre_barre.style.top=h;
        cadre_contenu.style.left=w;
        cadre_contenu.style.top=h+30;
        cadre_contenu.style.display='none';
        cadre_barre.onmousedown=beginDrag;
    }else if (dom) {
        var w=window.outerWidth-200;
        w=0
        document.getElementById('cadre_barre').style.left=w;
        document.getElementById('cadre_barre').style.top=h;
        document.getElementById('cadre_contenu').style.left=w;
        document.getElementById('cadre_contenu').style.top=h+30;
        document.getElementById('cadre_contenu').style.display='none';
        document.getElementById('cadre_barre').addEventListener('mousedown',beginDrag, false);
    }else if (ns4) {
        var w=window.outerWidth-200;
        w=0
        document.layers.cadre_barre.left=w;
        document.layers.cadre_barre.top=h;
        document.layers.cadre_contenu.left=w;
        document.layers.cadre_contenu.top=h+30;
        document.layers.cadre_contenu.visibility='hide'
        document.captureEvents(Event.MOUSEDOWN);
        document.onmousedown=beginDrag;
    }
}
  
function doDrag(e) {
    if (ie4) {
        var difX=event.clientX-window.lastX;
     var difY=event.clientY-window.lastY;
        var newX1 = parseInt(cadre_barre.style.left)+difX;
     var newY1 = parseInt(cadre_barre.style.top)+difY;
     cadre_barre.style.left=newX1+'px';
     cadre_barre.style.top=newY1+'px';
     cadre_contenu.style.left=newX1+'px';
     cadre_contenu.style.top=newY1+30+'px';
     window.lastX=event.clientX;
     window.lastY=event.clientY;
    }else if (dom) {
        var difX=e.clientX-window.lastX;
     var difY=e.clientY-window.lastY;
        var newX1 = parseInt(document.getElementById('cadre_barre').style.left)+difX;
     var newY1 = parseInt(document.getElementById('cadre_barre').style.top)+difY;
     document.getElementById('cadre_barre').style.left=newX1+'px';
     document.getElementById('cadre_barre').style.top=newY1+'px';
     document.getElementById('cadre_contenu').style.left=newX1+'px';
     document.getElementById('cadre_contenu').style.top=newY1+30+'px';
     window.lastX=e.clientX;
     window.lastY=e.clientY;
    }else if (ns4) {
        var difX=e.pageX-window.lastX;
     var difY=e.pageY-window.lastY;
        var newX1 = parseInt(document.layers.cadre_barre.left)+difX;
     var newY1 = parseInt(document.layers.cadre_barre.top)+difY;
     document.layers.cadre_barre.left=newX1;
     document.layers.cadre_barre.top=newY1;
     document.layers.cadre_contenu.left=newX1;
     document.layers.cadre_contenu.top=newY1+30;
     window.lastX=e.pageX;
     window.lastY=e.pageY;
    }
}
  
function beginDrag(e) {
    if (ie4) {
        window.lastX=event.clientX;
     window.lastY=event.clientY;
     document.onmousemove=doDrag;
     document.onmouseup=endDrag;
//        if (event.srcElement.id=='cadre_barre'){
//            Récup de l'Id d'un élément sous IE
//        }
    }else if (dom) {
        window.lastX=e.clientX;
     window.lastY=e.clientY;
     window.onmousemove=doDrag;
     window.onmouseup=endDrag;
        myattr=e.target.getAttribute('ID');
//        if(myattr=='cadre_barre') {
//            Récup de l'ID d'un élément sous NS6
//        }
    }else if (ns4) {
        window.lastX=e.pageX;
     window.lastY=e.pageY;
     document.captureEvents(Event.MOUSEMOVE)
     document.onmousemove=doDrag;
     document.captureEvents(Event.MOUSEUP)
     document.onmouseup=endDrag;
    }
}
  
function endDrag(e) {
     if (ie4 || ns4) {
         document.onmousemove=null;
     }else if (dom) {
        window.onmousemove=null;
    }else if (ns4) {
        alert('endDrag');
        document.onmousemove=null;
    }
}
  
</script>
  
  
</head>
  
<body bgcolor='white' text='black' link='blue' vlink='purple' alink='red' onload='start();'>
  
<p><script language='JavaScript'>
    var ns4 = (document.layers)? true:false;
    var ie4 = (document.all)? true:false;
    var dom = (document.getElementById)? true:false;
    if ((dom) || (ie4)) {
        document.write("<div id='cadre_contenu' class='barre_contenu'><div id='cadre_barre' class='barre_titre'><table class='table_titre' cellpadding='5' cellspacing='0' width='310'><tr><th width='275' height='19' valign='middle' nowrap bgcolor='#CC9900'><p>ici pour deplacer la mini fenetre</p></th><th width='15' height='19' valign='middle' nowrap bgcolor='#CC9900'><p><a href='#' onclick='onoffdisplay();'><font color='red'>X</font></a></p></th></tr></table></div><table class='table_contenu' cellpadding='5' cellspacing='0' width='310'><tr><td width='300' height='263' align='center' valign='middle' colspan='2' bgcolor='white'><p><img id='visual' src='' border='0'></p></td></tr></table></div>");
    } else if (ns4) {
         document.write("<layer id='cadre_contenu' class='barre_contenu'><layer id='cadre_barre' class='barre_titre'><table class='table_titre' cellpadding='5' cellspacing='0' width='310'><tr><th width='275' height='19' valign='middle' nowrap bgcolor='#CC9900'><p>ici pour deplacer la mini fenetre</p></th><th width='15' height='19' valign='middle' nowrap bgcolor='#CC9900'><p><a href='#' onclick='onoffdisplay();'><font color='red'>X</font></a></p></th></tr></table></layer><table class='table_contenu' cellpadding='5' cellspacing='0' width='310'><tr><td width='300' height='263' align='center' valign='middle' colspan='2' bgcolor='white'><p><img id='visual' src='' border='0'></p></td></tr></table></layer>");
    }
</script>
  
  
  
  
  
</p>
<p><a href="#" onclick="changer_image('1.gif');">image 1 .gif</a></p>
<p><a href="#" onclick="changer_image('2.gif');">image 2 .gif</a></p>
</body>
  
</html>

Commentaire de atlante34 le 23/05/2006 10:19:19

merci Marcial,
Il est vrai qu il est mieux de faire bouger directement le div.
Merci de ton code
A++

Commentaire de bobabar le 15/05/2007 16:33:16

Je n'ai pas réussi à le faire fonctionner que ce soit sous IE 6 ou FireFox 2.0 (pris les fichiers du .zip).

A+

Commentaire de jiminy2 le 08/09/2007 11:32:13

Pareil, ça ne marche pas pour moi.

j'ai trouvé un code similaire, ici : http://i.gautier.free.fr/jsprof/scripts/r6.htm

Commentaire de cirkooo le 08/06/2009 01:33:59

le 1 er et deuxieme code marche impecablement,  mais que le code est long. Ça doit être bien de comprendre tous ce code.... ^^.

 Ajouter un commentaire




Nos sponsors


Sondage...

CalendriCode

Mai 2012
LMMJVSD
 123456
78910111213
14151617181920
21222324252627
28293031   

Consulter la suite du CalendriCode

A découvrir



 
Développement réalisé par Nicolas SOREL (Nix) avec l'aide de : Cyril DURAND et Emmanuel (EBArtSoft), Merci à Vincent pour ses précieux conseils.
CodeS-SourceS.com© Toute reproduction même partielle est interdite sauf accord écrit du Webmaster
CodeS-SourceS.com© est une marque déposée tous droits réservés

Google Coop CodeS-SourceS Google Coop CodeS-SourceS
Temps d'éxécution de la page : 2,621 sec (3)

Nous contacter | Annoncer sur CodeS-SourceS | Mentions légales