Popup-Move

Wie man Pop-Up-Fenster bewegen kann ...

Voraussetzungen:

openEngine 1.6 im Verzeichnis /htdocs

Ziel: Ein Pop-Up-Fenster (<div> ... </div>) wird mit der Maus neu positioniert.

Schritt 1: Java-Skript für die Bewegungsfunktionen, kann in die Datei /htdocs/templates/_javascript/javascript.js eingetragen werden:

var dragapproved=false
var ie5=document.all&&document.getElementById
var ns6=document.getElementById&&!document.all
var ref;

function drag_drop(e){
if (ie5&&dragapproved&&event.button==1){
ref.style.left=tempx+event.clientX-offsetx+"px"
ref.style.top=tempy+event.clientY-offsety+"px"
} else if (ns6&&dragapproved){
ref.style.left=tempx+e.clientX-offsetx+"px"
ref.style.top=tempy+e.clientY-offsety+"px"
}
}

function initializedrag(pref,e){
ref=pref;
offsetx=ie5? event.clientX : e.clientX
offsety=ie5? event.clientY : e.clientY
tempx=parseInt(ref.style.left)
tempy=parseInt(ref.style.top)
dragapproved=true
ref.onmousemove=drag_drop
}

function stopdrag(ref){
dragapproved=false;
ref.onmousemove=null;

Der Aufruf erfolgt mit den beiden Triggern:

onMousedown und onMouseup

Beispiel bei dem Eingabe-Pop-Up für neue Beitrage im »kleinen Forum«:

Anmerkung:

Obwohl die Style-Werte für top und left bereits im Style-Sheet definiert wurden, müssen sie hier nochmals angegeben werden (warum auch immer)!