Reflection using CSS instead of Canvas

18 views
Skip to first unread message

Stefan

unread,
Aug 21, 2009, 6:54:18 AM8/21/09
to CSS Visual Effects
You make like to know that it is not necessary to use the canvas to
create a reflection of the image as this can be done simply with CSS.
Here is the modified code for zflow.css. You can then remove the
reflection function code from zflow.js.

/* Added reflection SN */
.zflow div.cell img
{
position: absolute;
-webkit-box-reflect:below 3px -webkit-gradient(linear, left top,
left bottom, from(transparent), color-stop(0.5, transparent), to
(white));
}

I am working on an app (rather than a website) with the QuickConnect
framework and locally stored images which works quite well. Using a
large number of images can be slow to load but I'm using 30 or so
240x120 images successfully.

Stefan
Reply all
Reply to author
Forward
0 new messages