reflection.js modification… fixed height… hehehe
April 9th, 2007
Reflections are all the buzz right now, if you don’t have reflections, you’re just not cool, and if you do have reflections, you’re just plain stupid for making out like everyone else… hehe…
Eitherway i’m a huge reflections addict — yes i admit it, i’m an addict — and i tend to use them a bit to much even sometimes, even in webdesign
This brings us to an awesome javascript which generates reflections for images on the fly, many of you (two people who’ll read this… lol) already know all about Cow’s reflection.js script. The one thing i’ve wanted from it tho, is being able to set fixed height reflections, rather than the reflections being X% the height of the image in question.
Hence i spent this afternoon haxx0ring reflection.js to add a rheightpx option, which with a little logic, you’ll figure what it does ;)… while i was at it, i also added a rgap option which puts a gap of X pixels between the image and the reflection.
As for bugs, well, the rheightpx option works fine in all browsers except Opera, which for reasons thats completely beyond my understanding, causes some very weird effects… after 2 hours of testing and messing around, i can’t find any reason for why it does it, but maybe Cow will know, and hopefully he’ll implement my changes into his script *hint*
Also, the rgap option is a bit sketchy between browsers unfortunately
And if you’re wondering about what you could possibly use a fixed height for, check this…
…which is the main reason i put effort into this modification today


April 9th, 2007 at 10:24 am
btw: that bookcase view for lib.rario.us is still in the works (as is the entire site, but the bookcase is still in a very early stage of development).
July 13th, 2007 at 12:02 pm
Hello Jim,
I’m Nicolas.
I work for a web hosting company and I noticed this image script reflection.js. I’d like to contact you or your friend Khlo about this script, as we are used to inform our customers about interesting applications from the open sourcre scene.
How could I contact you or him n private about this?
Looking forward reading from you,
Best regards,
Nicolas Morel
September 25th, 2007 at 10:53 am
I am looking to add rounded_corners_lite.inc to a that has three images and uses reflection.js. The problem is 2 fold. First, I am not well versed in javascript and second, I have spent hours reading and trying to fix the window.onload situation arising from two scripts on one page. Here is my problem: I don’t know how to actually determine the location of this in each script and the many examples of how to work around this has my head spinning. Is there any possible simplified way of understanding how the fix really works? I would be willing to send you all the script if you would be kind enough to assist. Thank you, Ron
August 9th, 2008 at 4:11 pm
Hi,
I am trying to create a reflected image that is in
an html anchor that has 1px border.
the img is reflected without the border, which is great
but it is aligned to the left and thus is 2px short
(1px for left and 1px for right border)
i would like to center the result so that the border
will be on the original and the reflect will be borderless and centered.
is that possible?
August 10th, 2008 at 9:16 pm
Hey Udi, what you’re trying to do get’s slightly complicated. But you can try styling the canvas element to position it relatively to get it where you want