Pretty cool shadow, but it would be cool to be able to set a shadow of 180° that can make shadow in the left and right of the container. In the example, it just make a shadow in the bottom which is no reallistic.

zmove

For those who are concerned, here is a possible solution. In order to apply it, modifications to prototype.js are in order.

http://dev.rubyonrails.org/ticket/11473

Position.clone(placeHolder, element);

Moreover, the image is doubled and placed on top of the original.

The error is specific to a case, when the image has a position:static property. I haven’t found a workaround for this yet. This is very sad, because in every other browser that I used for testing (FF2.0/Opera9/Chrome/Safari) your script works perfectly.

Is there any solution for this problem?
(Sorry for my bad english)


function stripIds(node) {
var stack = new Array;
stack[stack.length] = node;
while (stack.length > 0) {
var n = stack.shift();
if (node.nodeType == Node.ELEMENT_NODE) {
if (n.id) {
n.removeAttribute('id');
}
if (n.hasChildNodes()) {
var children = n.childNodes;
for (var i=0; i<children.length; i++) {
stack.push(children[i]);
}
}
}
}
return node;
}


i have used the same code u have given. But getting error like undefined draggable..

have also used

var example3change = function() {
Shadower.shadow(’example3?,{
opacity:0.7,nestedShadows:4
});
}
new Draggable(’example3?, { change: example3change });

var example3change = function() {
  Shadower.shadow('example3',{
    opacity:0.7,nestedShadows:4
    });
}
new Draggable('example3', { change: example3change });That way shadow() is called every time the Draggable “change” event fires.

uniform_shadow: function(element)
  {
    element = $(element);
    var options = Object.extend(
    {
      distance: 8,
      opacity: 0.7,
      nestedShadows: 4,
      color: '#000000'
    }, arguments[1] || {});
    var positionStyle = Element.getStyle(element, 'position');
    var parent = element.parentNode;
    if (!element.shadowZIndex)
    {
      if (positionStyle != 'absolute' && positionStyle != 'fixed')
      {
        var placeHolder = this.idSafeClone(element);
        placeHolder.id = null;
        parent.insertBefore(placeHolder, element);
        Position.absolutize(element);
        Position.clone(placeHolder, element);
        element.style.margin = '0';
        placeHolder.style.visibility = 'hidden';
        positionStyle = 'absolute';
      }
      element.shadowZIndex = new Number(Element.getStyle(element, 'zIndex') ? Element.getStyle(element, 'zIndex') : 1);
      element.style.zIndex = element.shadowZIndex + options.nestedShadows;
    }
    if (arguments[2]) // force recreate
      this.deshadow(element);
    // create shadows
    if (!element.shadows)
    {
      element.shadows = new Array(options.nestedShadows);
      for (var i = 0; i < options.nestedShadows; i++)
      {
        var shadow = document.createElement('div');
        Element.hide(shadow);
        shadow.appendChild(document.createTextNode(' '));
        if (parent)
          parent.appendChild(shadow);
        shadow.style.position = positionStyle;
        shadow.style.backgroundColor = options.color;
        Element.setOpacity(shadow, options.opacity / options.nestedShadows);
        shadow.style.zIndex = element.shadowZIndex + i;
        element.shadows[i] = shadow;
      }
    }
    var legendHeight = this.getLegendHeight(element);
    // position shadows
    Position.prepare();
    var offsets = Position.positionedOffset(element);
    var topOffset = -options.distance;
    var leftOffset = -options.distance;
    element.shadows.each(function(shadow, i)
    {
      shadow.style.top = Math.ceil(offsets[1] + topOffset + i + (legendHeight / 2)) + 'px';
      shadow.style.left = (offsets[0] + leftOffset + i) + 'px';
      shadow.style.width = (element.offsetWidth - (2 * i)) + 2 * options.distance + 'px';
      shadow.style.height = (element.offsetHeight - (2 * i) - (legendHeight / 2)) + 2* options.distance + 'px';
      Element.show(shadow);
    });
  },
I hope it will be useful…let me know!
Bye