Replace Flash with jQuery:Tutorials and Resources
Flash been around for sometime. While some web designer loves to work with flash the other despisethe usage of flash on webpage. In this post we are lobbying to increase the use of jQuery on websites.
Image Credit: Response Time: Eight Seconds, Plus or Minus Two
If you have a whole website built on flash because of the fancy transition, the load time is unfavorable on the user end and also bad for the search engines. As many researches has shown that average time people are willing wait for a webpage to load varies between 0.4-4 seconds. Therefore it might not be wise to use flash to create an entire website. Flash has it’s places for example: games, splash pages, banners, online interactive application and
Three Simple Reasons Why You Should Use jQuery
- jQuery faster, lighter (only 155kb, Minified), cross browser compatible.
- You can almost have the same effects and functionality that you get using flash using jQuery. ( The included tutorials in this post is a proof that)
- Flash is not compatible on many mobile devices such as iPhone and mobile browsing is increasing day by day.
If you want more information on flash vs jQuery head over logicpool for detailed comparison.
Now that we have explained to you why you should use jQuery when creating webpage, here are some tutorial that you can use to achieve Flash like effect, hopefully with less coding, timing.
This tutorial in detail explains how to create a image slideshow with Mosaic transitions. You can modify the speed and also how the mosaic is viewed.
Using a jQuery animate method this tutorial shows you how to create an interactive menu. The coding is fairly simple and understandable
Web Developer Jonathan Snook shows how to create a jQuery slideshow without any plugin. It is as simple as six lines of code. You can modify the interval between the images
This tutorial improves usability and user experience using jQuery. You will learn how to and blurr or focuses when selected the inputs in the form.
A step by step tutorial that explains how to easily create a jQuery plugin. You can use the same technique described in the tutorial for navigation, menu or images.
Sliding is door is quite famous for navigation. In this tutorial the technique is applied to images to show image description. It could very useful if you are creating a gallery site
This tutorial is very innovative. Forget about Flash. Using CSS and jQuery you will learn how to have background that rotates while the navigation is overlayed.
As the titles states, this tutorial shows how to simulate brush strokes in navigation sprites and jQuery.
This is more of plugin showcase. Nevertheless, the page includes a tutorial on how implant the plugin. What is so awesome about the plugin is the transition between slides. They are flash-like smooth transitions.
A very simple yet effective tutorial on how to achieve the fade effect using three line of code.
Using CSS3 transform property and jQuery , this tutorial creates an image gallery that is very dynamic.
Learn how to create a navigation with different effect using jQuery background position plugin.
jQuery blinds another fresh slider that deserves attention. It is very easy to implant, smooth animated transition and cross browser supported.
A creative menu that rotates using jQuery.
This is a tutorial of the future. A very creative, unique jQuery that shows how to mimic the photoshoot using jQuery.
Want an image with hints and description ? No problem. Using this tutorial you will be able to create and interactive picture.
Very ingenious use of jQuery. This tutorial explains how the author crated an interactive map using jQuery .
More Useful jQuery Resources
Finally, I would like to point out this article it is not totally disregarding flash. As I have mentioned above flash is useful for certain things, but for the web perhaps seeking out if there is alternate options( which is jQuery), might be best for user experience and faster websites.