Gawin: Tipps und Änderungsvorschläge für meine Drag'n Drop - Klasse

Beitrag lesen

Ok, langsam wirds peinlich, hab den Fehler gefunden.
Aber irgent wie schaffen IE5.5-IE7 es nicht die DIV's mit "class='dragobj'" zu verschieben,
verschiebt aber die sachen mit "class='window'" wunderbar.
Der IE8 verweigert sogar glatt alles!!!
Aber ich weiss einfach nicht warum.

Hier die aktualisierte drag_n_drop.js:

  
/********************************************************/  
/* Auschnitt aus meiner mainlibary die ich für          */  
/* die DragNDrop-Klasse genutzt habe                    */  
/********************************************************/  
mouse_pos = function(e) {  
    if(!e) e = window.event;  
  
    var body = (window.document.compatMode && window.document.compatMode == "CSS1Compat") ?  
                window.document.documentElement : window.document.body;  
    pos={X:null,Y:null};  
    if (typeof e.pageX == 'number'){  
        pos.Y = e.pageY;  
        pos.X = e.pageX;  
    }else{  
        pos.Y = e.clientY + body.scrollTop - body.clientTop;  
        pos.X = e.clientX + body.scrollLeft - body.clientLeft;  
    }  
  
    return pos;  
}  
  
_$ = function(clas, parent){  
    parent = parent || document;  
  
    if(document.getElementsByClassName && document.getElementsByClassName(clas)){  
        var el = parent;  
        var ret = el.getElementsByClassName(clas);  
    }else if(document.querySelectorAll && document.querySelectorAll('.class')){  
        var ret = document.querySelectorAll('.class');  
    }else{  
        var obj = document.all ? document.all : (document.getElementById(parent) || document.body).getElementsByTagName('*');  
        var ret = new Array();  
        for( var i=0, l=obj.length; i<l; i++){  
            if(hasClass(obj[i], clas)) ret.push(obj[i]);  
        }  
    }  
    return ret;  
}  
  
hasClass = function(obj, clas){  
    if(document.all && obj.className != null){  
        if(clas == obj.className) return true;  
    }else if(obj.getAttribute("class")!=null){  
        var clas_erg = obj.getAttribute("class").split(" ");  
    }else return false;  
  
    if(clas_erg){  
        for(var i=0, l=clas_erg.length; i<l; i++){  
            if(clas_erg[i] === clas) return true;  
        }  
        return false;  
    }  
}  
  
function DragNDrop(){  
    var _this = this; // Selbstreferenz  
    this.drag_obj = null; // Speichert das aktuell zu bewgende Objekt  
  
  
    this.drag_objects = _$("dragobj"); // Speichert alle mit class="drag_obj" ab  
    this.windows = _$("window"); // Speichert alle mit class="window" ab  
  
    this.drag_obj_pos = {X:null,Y:null}; // Mausposition relative zum Dragobjekt  
    this.pos = {X:null,Y:null}; // Mausposition  
  
    this.findPos = function(obj) {  
	var curleft = curtop = 0;  
        if (obj.offsetParent) {  
            do {  
	    	curleft += obj.offsetLeft;  
    		curtop += obj.offsetTop;  
            } while (obj = obj.offsetParent);  
            return {X:curleft,Y:curtop};  
        }  
    }  
  
    /********************************************************/  
    this.windowMouseDown = function(){  
        _this.z_index();  
        this.style.zIndex = 9999;  
    }  
  
    for(var i=0, l=this.windows.length; i<l; i++){  
        this.windows[i].onmousedown = this.windowMouseDown;  
    }  
    /********************************************************/  
    this.objMouseDown = function(e){  
        _this.drag_obj = this;  
  
        _this.pos = mouse_pos(e);  
  
        if(!hasClass(this.parentNode, "window")){  
            var objPos = _this.findPos(this);  
            //alert(objPos.X+" : "+objPos.Y);  
            _this.drag_obj_pos.Y = _this.pos.Y-this.offsetTop;  
            _this.drag_obj_pos.X = _this.pos.X-this.offsetLeft;  
  
            this.style.zIndex = 10000;  
  
        }else{  
            var objPos = _this.findPos(this.parentNode);  
  
            _this.drag_obj_pos.Y = _this.pos.Y-this.parentNode.offsetTop;  
            _this.drag_obj_pos.X = _this.pos.X-this.parentNode.offsetLeft;  
  
            this.parentNode.style.zIndex = 10000;  
        }  
        this.style.cursor = "move"; // Ändert den Cursor in eine Hand  
  
        _this.z_index();  
    }  
  
    for(var i=0, l=this.drag_objects.length; i<l; i++){  
        var obj = this.drag_objects[i];  
  
        obj.onmousedown = this.objMouseDown;  
    }  
  
    /********************************************************/  
    document.onmousemove = function(e){  
        if(_this.drag_obj != null){  
            _this.pos = mouse_pos(e);  
  
            var posX = _this.pos.X-_this.drag_obj_pos.X;  
            var posY = _this.pos.Y-_this.drag_obj_pos.Y;  
  
            if(!hasClass(_this.drag_obj.parentNode, "window")){  
                var style = _this.drag_obj.style;  
                style.position = "absolute";  
                style.top = posY + "px";  
                style.left = posX + "px";  
            }else{  
                var style = _this.drag_obj.parentNode.style;  
                style.position = "absolute";  
                style.top = posY + "px";  
                style.left = posX + "px";  
            }  
        }  
    }  
  
    /********************************************************/  
    document.onmouseup = function(e){  
        if(_this.drag_obj){  
            var obj = _this.drag_obj;  
            _this.drag_obj.style.cursor = "default"; // setzt den Cursor wieder auf normal  
  
            _this.z_index();  
  
            if(hasClass(_this.drag_obj.parentNode, "window")){  
                _this.drag_obj.parentNode.style.zIndex = 9999;  
            }else{  
                _this.drag_obj.style.zIndex = 9999;  
            }  
  
            _this.drag_obj = null; // Beendet  
        }  
    }  
  
    /********************************************************/  
    this.z_index = function(){  
        for(var i=0, l=_this.drag_objects.length; i<l; i++){  
            var obj = _this.drag_objects;  
  
            if(hasClass(obj[i].parentNode, "window")) var _obj = obj[i].parentNode;  
            else var _obj = obj[i];  
  
            if(_obj.style && _obj.style.zIndex){  
                _obj.style.zIndex = parseInt(_obj.style.zIndex)-1;  
            }  
        }  
    }  
}  
  
function init(){  
    var dragClass = new DragNDrop();  
}  
  
contentLoaded(window, init);  

Die index.html is gleich geblieben ausser das "class='drag_obj'" zu "class='dragobj'" wurde. Demoseite findet Ihr wieder HIER.

Hoffe mir kann jemand helfen.
Gruss Gawin