Beautiful blink transition effect slider

There is use of two photos with the same dimensions. Only HTML code will need from loading the scripts is an html element. I’m using a div class that use as our container in this "Beautiful blink transition effect slider". It should have a unique id, named it "mosaic".
 [gap]
The only piece of CSS code you will have to write is the following (replace the images file names with yours ).
[gap height="10"]
Beautiful blink transition effect slider

[button color="orange2" link="http://demo.tricksway.com/1401/index.html" target="_blank"]Demo[/button] [button color="orange2" link="http://himstar-download.googlecode.com/files/1401.zip" target="_blank"]Download[/button]

Code Sample:
 [gap]

#mosaic

{
background-image: url('bottom.jpg');
}

#mosaic span.hover
{
float: left;
background-image: url('top.jpg');
}

* Do you like this story? Then why not share it with your Friends *
If you enjoyed this post and wish to be informed whenever a new post is published, then make sure you subscribe to our regular Email Updates!

Himanshu is a young engineer living in India. Currently working at LiveCareer as a software engineer. He is an ethical hacker & blogger too, doing lots of crazy stuff... If you seem interesting, go through his portfolio: www.himstar.info : "Open Source. Millions of open minds can't be wrong!"

2 comments: On Beautiful blink transition effect slider

Leave a reply:

Your email address will not be published.

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Site Footer

Sliding Sidebar

We are India’s largest Startup Community


We are team of ' Delhi Startups ' , most active startup community with strict spam policy.
We are making !deas happen..for future, business and jobs without charging anything, with connecting entrepreneurs.. It's a reason to trust on us.
Come and join or subscribe, we will defiantly give a reason to like us.

Our Facebook Page