- Home /
JavaScript and Ajax second addition Tutorial 11 case problem 2
Having problem with shadow code shadow.js or overlay.js. My shadow appears in front of my box instead of behind it.
Here is the shadow.js
Custom objects and methods
shadow(source, offX, offY, r, g, b, op) Constructs a shadow object for the source object with horizontal and vertical offsets offX and offY, and color value r,g,b and opacity op.
*/ function shadow(source, offX, offY, r, g, b, op) { this.srcObject = source; this.offsetX = offX; this.offsetY = offY; this.color = "rgb(" + r + "," + g + "," + b + ")"; this.opacity = op; }
shadow.prototype.addToPage = function() { this.divElem = document.createElement("div"); document.body.appendChild(this.divEle… this.divElem.id = this.srcObject.id + "DropShadow"; this.divElem.style.backgroundColor = this.color; this.divElem.style.width = getStyle(this.srcObject, "width"); this.divElem.style.height = getStyle(this.srcObject, "height"); setOpacity(this.divElem, this.opacity); this.divElem.style.position = "absolute"; this.divElem.style.display = "none"; var objectZ = getStyle(this.srcObject, "z-index"); if (objectZ == "auto" || objectZ == "undefined") objectZ = 1; this.srcObject.style.zIndex = objectZ + 1; this.divElem.style.zIndex = objectZ;
}
overlay.js
addEvent(window, "load", addOverlay, false);
function addOverlay() {
var allOverlayTargets = document.getElementsByTagName("td");
for (var i = 0; i < allOverlayTargets.length; i++) {
var overlayID = allOverlayTargets[i].id + "Overlay"; var overlay = document.getElementById(overlayID);
allOverlayTargets[i].onmouseover = function(e) { this.style.backgroundColor = "rgb(255, 225, 255)"; } allOverlayTargets[i].onmouseout = function(e) { this.style.backgroundColor = "rgb(255, 255, 255)"; }
allOverlayTargets[i].onmousedown = function(e) { var evt = e || window.event; var overlay = document.getElementById(this.id + "Overlay"); overlay.style.display = "block";
if (evt.pageX) { overlay.style.left = evt.pageX + 5 + "px"; overlay.style.top = evt.pageY + 5 + "px"; } else { var offX = document.documentElement.scrollLeft + document.body.scrollLeft; var offY = document.documentElement.scrollTop + document.body.scrollTop; overlay.style.left = evt.clientX + offX + 5 + "px"; overlay.style.top = evt.clientY + offY + 5 + "px"; } myShadow = new shadow(overlay, 13, 13, 0, 0, 0, 30); myShadow.addToPage(); myShadow.divElem.style.display = "block"; myShadow.divElem.style.left = parseInt(overlay.style.left) + myShadow.offsetX + "px"; myShadow.divElem.style.top = parseInt(overlay.style.top) + myShadow.offsetY + "px"; }
allOverlayTargets[i].onmouseup = function(e) { var evt = e || window.event; var overlay = document.getElementById(this.id+"Overlay… overlay.style.display = "none"; var shadowElem = document.getElementById(overlay.id + "DropShadow"); document.body.removeChild(shadowElem); }
} }
Your answer
Follow this Question
Related Questions
Multiple Cars not working 1 Answer
Attach object as child using code 1 Answer
gameObject.active Find 1 Answer
Can someone help me fix my Javascript for Flickering Light? 6 Answers
Setting Scroll View Width GUILayout 1 Answer