Like the article? Be sure to subscribe to our RSS feed and follow us on Twitter to stay up on recent content.

Why should we use jQuery instead of Flash

There are a bulk of differences regarding the benefits and disadvantages between these two guys, but in this article, we just list some their most important features.

First, in order to build an application using jQuery, you don’t have to purchase anything, but with Flash you have to buy Flash software to do the encoding. And Flash software could cost you $699 and no less than$199 to upgrade from older versions. jQuery and most other JavaScript frameworks cost you nothing to use(some jQuery plugins are not free for commercial usage). At this point, jQuery wins!

The second and the most problem with Flash is it isn’t available on the iPhone, and many other mobile devices. According to Adobe, 98 percent of desktop computers and laptops currently support Flash, but the truth is it’s not compatible with all browsers including those on the iPhone, iPad and cell phones. Unlike Flash, jQuery supports screen reader accessibility. By using accDND (a jQuery plugin), we can enable keyboard and screen reader which is an accessible drag & drop functionality plugin for jQuery. jQuery wins again!.

In the next comparison, we’ll consider using jQuery instead of Flash in its customization. jQuery and other JavaScript frameworks are built for easy development and customization.

Although jQuery wins Flash in some angles of problem, it cannot fully replace Flash in use. Where Flash fully supports 3D capabilities and many extensive features for object animation, jQuery is limited. Furthermore, jQuery UI is nothing compared with Flash’s built-in UI – That’s one reason for Flash’s price tag. Besides this, we get problems with proper font display. We can use any fonts on the web with Flash, but we cannot do the same with JavaScript, although we have a ton of tools and services available to help us to embed fonts in HTML page.

One other area to look at is video. This is where HTML5 comes into the picture — which is a completely different post in and of itself.

In most cases, though, jQuery can do better than Flash. From here, we’ll round up some tutorials and jQuery plugins that are simply awesome. Each of these teaches how to get a desired “Flash” effect, but with jQuery instead.

Tutorials

Building an interactive map with jQuery instead of Flash

This tutorial helps you build an interactive map with jQuery instead of Flash. It helps you build the markup for the maps and a couple of jQuery functions to make it all work. It’ll be an interactive map that shows some information and the location of the various Marine Science outposts across the state. Information of the the locations are represented by dots, and clicking them, will display an info box.

Animated Sharing Bar With jQuery & CSS

Using pure jQuery, we can make an animated sharing bar which will enable your website visitors to share posts on a number of social networks. It runs smoothly on all browser versions.

The youlove.us scrolling background effect explained

If you have checked out the design of YouLove.us, you would be excited with its colorful animated background. Here they explained how they created their beautiful animated background. The technique is very simple. It will scroll only the body background while every element above it is transparent.

Crafting an Animated Postcard With jQuery

Learn the basics of setting up a continuous animation with an illustrated postcard which Flash usually does. This tutorial is a good one for you to learn how to work with animation loop in jQuery and the easing plugin.

Building an Animated Cartoon Robot with jQuery

A tutorial on CSS-tricks to create an incredible animated cartoon robot. It was created by layering several empty divs over each other with transparent PNGs as background images. This effect simulates a faux 3D animated background dubbed the “parallax effect” originating from old-school side scrolling video games. This is one of the best examples of where jQuery is replacing Flash.

Cloud of Bacon

In this tutorial, you will be inspired with the camera effect. The tutorial runs multiple animations (of arbitrary duration) at the same time, queues animations and even animates complex properties like colors or clipping rectangles.

A Colorful Clock With CSS & jQuery

Here’s a colorful clock created with jQuery and CSS only. This is really an interesting post to check out. It’s not a tutorial about the jQuery animate() function, but the jQuery helps CSS animation property works correctly. I highly recommend checking out all of the Tutorialzine Tutorials for jQuery inspiration.

jQuery OS X Stack and Drop Stack


A sexy menu created using jQuery and CSS with OS X style docks and stacks navigation. It’s super lightweight (~1kb) and is a really creative “outside the box” method of navigation for a website. It might be a little awkward having the navigation in the bottom right or left of the browser window but it would certainly be creative and saves lots of space.

Old School Clock with CSS3 and jQuery

Transform:rotate is a new feature of CSS3 which lets you rotate HTML elements. This tutorial will help you create an awesome “tick tock” clock that animates very smoothly. The jQuery code in this tutorial helps the clock get correct time information then inject all the CSS3 style for each element.

Making a 3D Engine in jQuery

Here they create a 3D engine that will allow us to create shapes simply by creating an array of points. This engine will have a Camera, a Scene and an Object. Perfect 3D cube in jQuery!

Puffing Smoke Effect in jQuery

An excellent tutorial features an impressive animation effect of cartoon-ish smoke which animates from factory smoke stacks. This tutorial provides a configurable jQuery plugin with instructions based on blog’s header of the author, so that you may create a similar animation effect for your website.

Plugins

jParallax

jParallax is a jQuery plugin that allows animation of simple parallax animations by animating the background-position of <div> elements.

jFlip

Create page flip using jQuery plugin instead of Flash. This plugins is useful for us to create the page flip effect that can be used in flipping page of a book. It could be a great idea for a comic book web site.

The Sexy Curls jQuery Plugin!

Another great jQuery plugin which lets you share in the beauty of the page fold. Remember in the past, we always use Flash to create this effect for ad slot. Today, forget Flash and try it with jQuery. Everything is the same except you’re not relying on Flash, guys!

Easy Slider 1.7 – Numeric Navigation jQuery Slider

This is really a nightmare with Flash because jQuery does it perfectly and even better than Flash does. There are a bulk of jQuery Slider Plugins out there, but Easy Slider is arguably the best one with a lot of features and options.

AnythingSlider jQuery Plugin

This is another awesome jQuery slider that comes with cool features. AnythingSlider is a plugin that was built to make implementing it and customizing it much easier than other plugins.

reel

Reel is a jQuery plugin which takes an image tag and makes it a live “projection” of pre-built animation frames sequence. Its aim is to provide a 360° view of something or someplace. It’s a great alternative to widely used Flash techniques.

Flot

Flot is a pure JavaScript plotting library for jQuery. It produces graphical plots of arbitrary datasets on-the-fly client-side. Like Flash, this plugin provides smooth and attractive graph for simple uses with nice features, zooming and mouse tracking.


한글버전 : http://mytory.co.kr/archives/831