Now I have a more 3-d look for it:
I think it's pretty coolCode:<html> <head> <script type="text/javascript"> var depth = 5 // in pixels onload = function() { var a = document.all? document.all : document.getElementsByTagName('*'); for (var i = 0;i < a.length;i++) { if (a[i].className == "shadow") { for (x = 0;x < depth;x++) { var newSd = document.createElement("DIV") newSd.className = "shadow2" newSd.style.width = a[i].offsetWidth newSd.style.height = a[i].offsetHeight newSd.style.left = a[i].offsetLeft + x newSd.style.top = a[i].offsetTop + x document.body.appendChild(newSd) } } } } </script> <style type="text/css"> .shadow { border:1px solid silver; padding:2px; font:10pt arial; position:relative; display:inline; background:white; z-index:100 } .shadow2 { overflow:hidden; background:black; position:absolute; filter:alpha(Opacity=15); opacity:0.2; -moz-opacity:0.2; -khtml-opacity:0.2; z-index:0 } </style> </head> <body> <div class="shadow">Test 1</div> <br><br><div class="shadow">Test Number 2</div> <br><br><a href="#" class="shadow">Link Test</a> </body> </html>
Reply With Quote
Bookmarks