Fenètre flotante
Soyez le premier à donner votre avis sur cette source.
Snippet vu 16 433 fois - Téléchargée 29 fois
Contenu du snippet
Voici une petite fenètre flotante.
Amusez-vous bien ! :)
Source / Exemple :
Dans le Head : <script> // by Erik Arvidsson for WebFX at http://webfx.eae.net var checkZIndex = true; var dragobject = null; var tx; var ty; var ie5 = document.all != null && document.getElementsByTagName != null; function getReal(el) { temp = el; while ((temp != null) && (temp.tagName != "BODY")) { if ((temp.className == "moveme") || (temp.className == "handle")){ el = temp; return el; } temp = temp.parentElement; } return el; } function moveme_onmousedown() { el = getReal(window.event.srcElement) if (el.className == "moveme" || el.className == "handle") { if (el.className == "handle") { tmp = el.getAttribute("handlefor"); if (tmp == null) { dragobject = null; return; } else dragobject = eval(tmp); } else dragobject = el; if (checkZIndex) makeOnTop(dragobject); ty = window.event.clientY - getTopPos(dragobject); tx = window.event.clientX - getLeftPos(dragobject); window.event.returnValue = false; window.event.cancelBubble = true; } else { dragobject = null; } } function moveme_onmouseup() { if(dragobject) { dragobject = null; } } function moveme_onmousemove() { if (dragobject) { if (window.event.clientX >= 0 && window.event.clientY >= 0) { dragobject.style.left = window.event.clientX - tx; dragobject.style.top = window.event.clientY - ty; } window.event.returnValue = false; window.event.cancelBubble = true; } } function getLeftPos(el) { if (ie5) { if (el.currentStyle.left == "auto") return 0; else return parseInt(el.currentStyle.left); } else { return el.style.pixelLeft; } } function getTopPos(el) { if (ie5) { if (el.currentStyle.top == "auto") return 0; else return parseInt(el.currentStyle.top); } else { return el.style.pixelTop; } } function makeOnTop(el) { var daiz; var max = 0; var da = document.all; for (var i=0; i<da.length; i++) { daiz = da[i].style.zIndex; if (daiz != "" && daiz > max) max = daiz; } el.style.zIndex = max + 1; } if (document.all) { //This only works in IE4 or better document.onmousedown = moveme_onmousedown; document.onmouseup = moveme_onmouseup; document.onmousemove = moveme_onmousemove; } document.write("<style>"); document.write(".moveme {cursor: move;}"); document.write(".handle {cursor: move;}"); document.write("</style>"); </script> <style> <!-- #testDiv {position: relative; height: 50px; width: 300px; border: 2 outset white; background: lightyellow; margin: 0px;} #title {background: activecaption; font: caption; width: 100%; color: captiontext; padding: 3px; margin: 0px;} #inner {border: 2 inset white; margin: 0px; padding: 3px;height: 100%;} --> </style> Dans le body : <div id="testDiv"> <div class="handle" handlefor="testDiv" id="title">Titre de la fenêtre</div> <div id="inner"> Le contenu de la fenêtre ici ! </div> </div>
Conclusion :
Amusez-vous bien ! :)
mon problem est que jai placé le lien d'appel de popup dans une ifram et quond je vai l'apelé le popup il prond une position en raport avec la position du ifram, donc si je deplace le assenceur de fenetre dans iframe le popup s'ouvre dans un mauvese position et le visiteur ne peut pas la consulter le contenue de cel ci.
j'ai pensé que si je peut adapter ce fonction mon popup restera toujour dans le même hauteur , mais je ne sais pas ou je peut metre le code parce que mon popup c'est n'est pas une fenetre en html, mais c'est une sorte de fenetre (slide)en javascript, donc n'a pas les balise <head> et
merci en avance
<center>
Titre de la fenêtre
Le contenu de la fenêtre ici !
</center>
Et c'est tout !!!
Pyroflo
http://www.abcpyro.fr.st
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.