/***********************************************************************************************\ * addShadow.js * * created: 12/15/06 by Darren Smith * * * * purpose: add drop shadow to a div with * * ability to handle different (grayscale only) background colors * * * * usage: * * 1. pass target div id and destination color like so: * * addShadow([div id], [destination color]); * * 3. where destination color is a single digit, hex string (therefore gray-scale only) * * for example: * * this adds a shadow starting at #333 fading to #ccc to the div with ID 'myDiv' * \***********************************************************************************************/ var usage = 0; function convertColorToHex(color){ switch(color){ case 10: newColor = "a"; break; case 11: newColor = "b"; break; case 12: newColor = "c"; break; case 13: newColor = "d"; break; case 14: newColor = "e"; break; case 15: newColor = "f"; break; default: newColor = String(color); break; } return newColor; } function convertColorFromHex(color){ switch(color){ case "a": newColor = 10; break; case "b": newColor = 11; break; case "c": newColor = 12; break; case "d": newColor = 13; break; case "e": newColor = 14; break; case "f": newColor = 15; break; default: newColor = Number(color); break; } return newColor; } function addShadow(divID, endingColor){ var objDiv = document.getElementById(divID); var content = objDiv.innerHTML; objDiv.innerHTML = ""; var workingDiv = objDiv; var startingColor = 7; endingColor = convertColorFromHex(endingColor); currentDiv = 0; while(endingColor > startingColor){ var newBorderDiv = window.document.createElement("div"); var newBorderDivID = "shadowBorderDiv" + String(currentDiv) + String(usage); newBorderDiv.setAttribute("id", newBorderDivID); workingDiv.appendChild(newBorderDiv); workingDiv = document.getElementById(newBorderDivID); var thisColor = convertColorToHex(endingColor); thisColor = "#" + thisColor + thisColor + thisColor; workingDiv.style.borderRight = "1px solid " + thisColor; workingDiv.style.borderBottom = "1px solid " + thisColor; //workingDiv.style.border = "1px solid " + thisColor; ++currentDiv; --endingColor; } var newContentDiv = window.document.createElement("div"); var newContentDivID = "shadowBorderContent" + usage; newContentDiv.setAttribute("id", newContentDivID); workingDiv.appendChild(newContentDiv); document.getElementById(newContentDivID).innerHTML = content; ++usage; }