Page 1 of 1

Javascript reflecting text - Possible?

Posted: Thu Jun 14, 2007 11:36 am
by RobertGonzalez
Ok, this may sounds a little weird, but is there a way to use Javascript to reflect text? I know it can be done with images (I have found reflection.js many times over) and I know the IE only filters (flipV() and flipH()) but I was hoping for a pure JS implementation of this effect.

Google is not my friend today. Does anyone know if it can be/has been done, and if so, where I might be able to locate resources on it? If not, does anyone have a clue as to what else I could search for other than:

Code: Select all

Javascript text reflection -photoshop
As always, all help is appreciated.

Posted: Thu Jun 14, 2007 1:45 pm
by Weirdan
js canvas

Posted: Thu Jun 14, 2007 1:47 pm
by Weirdan

Posted: Thu Jun 14, 2007 3:20 pm
by RobertGonzalez
Do any of those examples show reflection of text? I couldn't find any that did, but I could have looked wrong. I am not looking for image reflection, I am looking to take text content and reflect it.

Posted: Thu Jun 14, 2007 3:33 pm
by superdezign
I'd think that, if it was possible, we'd see a lot of amateur websites utilizing the effect.

I've played around with the idea before and came up with nothing. The best was to do it through GD libarry, and that idea got thown away quickly due to it's wastefulness.

I would imagine that if you were able to create an upside-down font, load it onto your server, and then access it through JS... (the last part is where I'm clueless :P)

Posted: Thu Jun 14, 2007 3:43 pm
by RobertGonzalez
Man, this makes me want to try to learn how to do this now.

Posted: Thu Jun 14, 2007 4:03 pm
by superdezign
Umm... You could do it in Flash, easily. :P

Posted: Thu Jun 14, 2007 4:36 pm
by RobertGonzalez
It needs to be something that can degrade peacefully. For what I want to do with it, if JS is not enabled, it should not really affect anyone's view of it. Not having flash enabled (like I don't) would jack it up pretty strong.

Posted: Thu Jun 14, 2007 5:15 pm
by nickvd
Everah wrote:It needs to be something that can degrade peacefully. For what I want to do with it, if JS is not enabled, it should not really affect anyone's view of it. Not having flash enabled (like I don't) would jack it up pretty strong.
Use jQuery to remove the text and replace it with the flash alternative...

Posted: Thu Jun 14, 2007 5:43 pm
by Ambush Commander
Remember that the whole point of doing this dynamically is so that the font styling can be changed without having to change any code. If it were to be done in Flash, you'd need some JavaScript to pass the necessary font family, size (this is not considering any browser scaling either), etc. parameters so it would know what to do.

Since JavaScript doesn't natively supported the rotation of text, I think canvas is the way to go. See transformations. Get back to us if you build something working!

Posted: Thu Jun 14, 2007 6:06 pm
by RobertGonzalez
Well, let the research begin. I am somewhat discouraged by this, but there has to be a way to get at what I want. So I will see what I can mess with to get at what I want to get at.

Posted: Fri Jun 15, 2007 12:20 pm
by Weirdan

Posted: Fri Jun 15, 2007 12:45 pm
by RobertGonzalez
Hell yes, I will be looking at the in just a little while. That is interesting weirdan. Thanks.