Hover effects with jQuery | Bypeople

Hover effects with jQuery

As we all know, jQuery has been the salvation for many web designers and developers that in the past had to spend many hours creating custom effects that looked rough and showed the absence of a better tool; of course that Flash was out there and many people adopted it as the favorite web tool, but the truth is that Flash was never meant to be a pure web program.

With the release of jQuery things became easier for programmers because now there was a program that spoke their language and allowed them to create amazing effects. One of the best examples of this is Mosaic, an splendid jQuery plugin that implements several great effects in your images easily.


Mosaic started as a tutorial and after it became an internet hit, the guys from Build Internet! decided to transform it into a jQuery plugin. The idea was basically to create an initial div tag that acted as a window where two other items of your selection will pop up.

You can visit the original post named “Sliding Boxes and Captions with jQuery” to take a look at how the plugin was created via CSS ad jQuery. The plugin offers a series of options that you can work with, including animation, opacity, preload, anchor_x / anchor_y and hover_x/ hover_y.


According to the author, the implementation of Mosaic is fairly easy, It operates with two panels, an overlay and a backdrop. The content in the overlay gets repositioned according to the options that you provide. Some of the main features that make Mosaic a stunning jQuery plugin are:

  • Automatically generates sliding boxes & captions.
  • Allows slide and fade animations with custom directions.
  • Preloads images within boxes.
  • Lightweight (just 2kb – minified).

Original link: Mosaic

Related Deals

Related Posts