• Sign In

Technology?

A site for testing the new tools I'm building, and a little talk about what I'm learning on the way.

Search
  • Home
  • TechnologyView my occasional technology posts.
  • Life
  • Contact
Edit - Delete
Back and NextBack and Next - Back and Next
« Internet Explorer CSS File Size Limit
What am I up to? »
Edit - Delete
Show Media ItemShow Media Item - Javascript Transition Effects

Javascript Transition Effects

africa » gambia » fajara
Friday, January 25, 2008

Here are some samples of some basic javascript transition effects.  We are thinking about putting some of these nifty effects into certain areas of .geographical media.  It seems to be rather trendy these days to do so. 

I have created the following effects: Fade In, Fade Out, Fly Out and Drop Out, Drop Back

The effects are all very easy to do with Javascript adjusting the style properties of the object you wish to have the effect on.  I found the opacity properties here at quirksmode  http://www.quirksmode.org/js/opacity.html .  I consider quirksmode to be the best source of well tested solutions to some of the more complex aspects of javascript programming.  I've used his work often and would recommend his site to anyone.

Here are the sample effects:

http://joshua.perina.com/transition-effects

I'll write more and explain the code once I've cleaned it up a bit.  At the moment it's just 1/2 hour quick prototype.

Edit - Delete
CommentsComments - Comments
Comments
 
There are 4 comments - add your comment
jay - Fajara, Gambia - Friday, January 25, 2008 5:59 AM
ship it! The site looks good.

Hope all is well.
joshua - Fajara, Gambia - Friday, January 25, 2008 9:02 AM
Thanks Jay!

We're getting close now... maybe one more month and I'll be spamming you all to come sign up!
Michelle - Florida, United States - Wednesday, June 11, 2008 6:44 AM
Hi,
I'm looking for a page transition affect so that when you click on a link from the home page it will look like a page in a book is turning to get to the new index.
I've done it in flash but it makes the file massive and would make web updates a nightmare. I'm trying to find a script that will create a similar affect. Any help would be greatly appreciated.
Thanks
Bhavesh - India, Asia - Wednesday, September 09, 2009 2:18 AM
Hi,
Fade button not working in fire fox.

Your Comment

Your Name

Your Location

To receive emails create a username or Sign In
Your Email
Username
Password
Confirm Password
Add me to the contact list.
Remember me on this computer.
Sign in below or Sign Up
Username
Password
loading...  Post Comment
 
Edit - Delete
Related TopicsRelated Topics - Related Topics
Related Topics
javascript, transition effects, fade in, fade out, fly out, drop out
Edit - Delete
Media ActionsMedia Actions - Media Actions
Media Actions
0
Promote
Email to a friend
Inquire
Save to delicious
Digg this
Stumble it
Edit - Delete
See AlsoSee Also - See Also
See Also
  • Limbas Hotel
  • Libyan Envoy Hails Gambia-Libya Relations
  • Drop down or flyout menu support added
  • Nostalgia
  • KHARAFI CLARIFIES

Try Lara

Build your own website with Lara.  A powerful content management system with easy and fun to use design tools. 

Visit http://getlara.com to learn more.

Go here for a good Javascript Html Editor.

Subscribe Now

Recent Posts

  • Ultimate Frisbee Mauritius
  • The best free icon collection on the internet - Icons Etc.
  • VGA Planets "Nu" - The official VGA Planets remake
  • Sending Email from Amazon EC2
  • Using SSL (https) with Mono HTTPListener
  • .NET MimeTypes Class in C#
  • Great WordPress Plugins
  • Flash IO Error #2038 when Uploading Files in .NET
  • Javascript DOM Ready for SSL in IE
  • Javascript Replace All with Variable
Website created with Lara by Geographical Media