Image with reflection effect.#

Introduction#

This JSPWikiStyle allows you to insert images with reflection effect. It is totally useless, but great fun.

Added to BrushedTemplate, Oct 06. –DF

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]
  /%
renders as:

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.

Add new attachment

Only authorized users are allowed to upload new attachments.

List of attachments

Kind Attachment Name Size Version Date Modified Author Change note
jpg
home_vulture.jpg 35.7 kB 1 15-Oct-2006 13:03 DirkFrederickx
png
smart-logo.png 4.2 kB 1 15-Oct-2006 13:04 DirkFrederickx
jpg
wet_vulture.jpg 14.3 kB 1 15-Oct-2006 13:08 DirkFrederickx
« This page (revision-7) was last changed on 23-Oct-2007 22:46 by DirkFrederickx