View topic - simple javascript effects/transitions

Stylegala Forums » Forums list » Javascript / DOM

simple javascript effects/transitions

Goto page 1, 2, 3, 4, 5, 6 Next Post new topic Reply to topic

Author	Message
Lost_User Joined: 22 Jun 2006 Posts: 0 Status: Offline	Posted: Thu Oct 27, 2005 04:56 Hi everyone, I'm a long time reader of this forum, but it's the first time I post here. I've created a small javascript effects library (3kb). You can get it here: http://moofx.mad4milk.net or watch some other demos here: http://moofx.mad4milk.net/tests.html It requires prototype.js (http://prototype.conio.net) to work, but a stripped down version (for effects only) is included in the download. Just thought it might be useful to someone, since I've recently seen some posts about javasript for hiding/showing html elements.

Sponsor

Lost_User Joined: 22 Jun 2006 Posts: 0 Status: Offline	Posted: Thu Oct 27, 2005 05:08 This is really great. I've been looking into AJAX recently, but the stuff on script.aculo.us is a bit too specific for my liking. Your scripts are exactly what I've been looking for. Thanks for sharing this.

Lost_User Joined: 22 Jun 2006 Posts: 0 Status: Offline	Posted: Thu Oct 27, 2005 07:14 I agree, thanks for sharing! Transitions are very slick.

Lost_User Joined: 22 Jun 2006 Posts: 0 Status: Offline	Posted: Thu Oct 27, 2005 11:24 I have been trying to achieve this effect with ajax for a website I'm working at, and guess what? Somoene has done it for me thank you for sharing this. Massimo

Lost_User Joined: 22 Jun 2006 Posts: 0 Status: Offline	Posted: Thu Oct 27, 2005 11:26 nice one

stylegala Site Admin Joined: 26 Aug 2004 Posts: 458 Location: Sweden Status: Offline	Posted: Thu Oct 27, 2005 15:30 Very nice indeed. I had to post this in the Stylegala news. Thanks!

G3 Preferred member Joined: 15 Oct 2004 Posts: 212 Location: United States Status: Offline	Posted: Thu Oct 27, 2005 15:57 Perfect! I have a site to redesign that will have a ton of content. Some of those transitions will be the perfect solution! How will these degrade though? What happens with javascript disabled? Thank you so much!

Lost_User Joined: 22 Jun 2006 Posts: 0 Status: Offline	Posted: Thu Oct 27, 2005 16:38 Thanx guys for your positive feedbacks, I didn't expect all this! How will these degrade though? What happens with javascript disabled? All the effects have a method called hide. Use it to start the page with the element hidden. `window.onload = function() { effect = new fx.Height('element'); effect.hide(); }` This way the element is hidden with javascript (for opacity effects the opacity is set to 0, for height effects the height is set to 0, and so on). If you have javascript disabled the element won't get hidden. And everyone gets content!

abundance New member Joined: 26 Nov 2004 Posts: 17 Location: Firenze, Italy Status: Offline	Posted: Thu Oct 27, 2005 18:10 that's so cool, valerio! mille grazie!... :)

Lost_User Joined: 22 Jun 2006 Posts: 0 Status: Offline	Posted: Thu Oct 27, 2005 21:31 I can't get it to work when I want to begin with my div hidden. I use the following code: `<script type="text/javascript"> window.onload = function() { effect = new fx.Height('commentform'); effect.hide(); var elements = new Array('commentform'); fadesize = new fx.FadeSize('commentform', {duration: 400}); } </script>` It starts hidden. But when I click it does the fadesize but then it immediately hides the div again. I'm no javascript expert. Should I split the hide part form the actual fx part ? How to solve this?

Goto page 1, 2, 3, 4, 5, 6 NextPage 1 of 6

Post new topic Reply to topic