Drop Shadow Effect using jQuery Plugin

Drop Shadow Effect using jQuery Plugin

dropshadow with jquery

Usually, you will add drop shadow effect using a graphic software, well would you like to know that you can also make good use of this great jQuery plug-in to add soft drop shadows behind page elements? You'd better be :)

The shadows which are created with this jQuery will not bound to the original elements, so they won't move or change size automatically if the original elements change. It is only intended for adding a few drop shadows to mostly stationary objects, like a page heading, a photo, or content containers.

If you want to apply this drop shadow jQuery, there are options for setting up:

* left : integer (default = 4)
* top : integer (default = 4) - The left and top parameters specify the distance and direction, in pixels, to offset the shadow.
* blur : integer (default = 2) -The blur parameter specifies the spread, or dispersion, of the shadow.
* opacity : decimal (default = 0.5) - The opacity parameter should be a decimal value, usually less than one.
* color : string (default = "black") - Color is specified in the usual manner, with a color name or hex value.
* swap : boolean (default = false) - The swap parameter reverses the stacking order of the original and the shadow.

You will see a demo tool on the source page and learn more by downloading this Drop Shadow JQuery plugin.

Incoming search terms:

  • jquery drop shadow
  • jquery shadow effect
  • jquery shadow
  • drop shadow jquery
  • jquery dropshadow
  • dropshadow jquery
  • shadow jquery
  • drop shadow jquery plugin
  • jquery drop shadow plugin
  • jquery drop shadows
  • shadow effect using jquery
  • how to get shadow effect in jquery
Voted by: