Submit your widget

jQuery flickr-Bomb images effect

Created 12 years ago   Views 13957   downloads 2310    Author zurb
jQuery flickr-Bomb images effect
View DemoDownload
64
Share |

Hopefully you had a chance to play around with the demo above and realized that flickrBomb provides an easy way for you to fill your prototypes with relevant content, and not just dull gray placeholder images. It's quick and easy, so let's dive in!

1. Set up

Getting flickrBomb to work on your pages is super simple. Make sure jQuery is loaded into your pages, preferably at the bottom.

<script src="http://code.jquery.com/jquery-1.6.1.min.js"></script>

We recommend using a CDN to host your jQuery for development environments, there are many: Google, jQuery, or Microsoft are all reasonable solutions. However, for live sites, it is best to switch out the CDN with a local copy.

Next up is to put the flickrBomb css file in the head section of your page

<link rel="stylesheet" href="css/flickrbomb.css">

After including jQuery and the css in the head of your page, all that is left is to include flickrBomb. Put flickrBomb at the bottom of your page, right before the closing body tag so as to insure that your page is loaded before flickrBomb is called.

<script src="js/jquery.flickrBomb.min.js"></script>

That's all you have to do for set up!

The article source:http://www.zurb.com/playground/rapid-prototyping-with-flickrbomb