Image with reflection effect.#
Introduction#
This JSPWikiStyle allows you to insert images with reflection effect. It is totally useless, but great fun.
Simply add a %%reflection style around your images. The reflection of the image appears below the image, and will fade into the background colour...
%%reflection [home_vulture.jpg] /%
 |
Reality check:
 |
Usage#
Put a %%reflection ... /% around your pictures to add a reflection image at the bottom. General format is :
%%reflection-<height>-<opacity> ..your images.. /%
- height : 1..100. Optional height value of the reflection image, in percent of the height of the reflected image (default = 30%)
- opacity : 1..100. Optional opacity or transparency value of the reflection image (default = 50%, 100 means not transparent)
Reality check :
 |
|
The Reflection Style is based on client-side javascript,
inspired by the great Reflection.js library at http://cow.neondragon.net/stuff/reflection/
,
adapted for mootools by Christophe Beyls (http://www.digitalia.be, MIT license), and refactored for jspwiki.
The javascript contains browser specific code for IE and non-IE, and may not operate well on older browser. It does not work in Safari < 2, Opera < 9 and Firefox < 1.5. However, it gracefully degrades and leaves you page perfectly readable.
);
background-repeat:no-repeat;
background-position:top;
background-size:48px;
text-align:center;
}