jQuery Plugin For Placeholder Images From Flickr - PixelHoldr

jQuery Plugin For Placeholder Images From Flickr - PixelHoldr
File Size: 7.56KB
Views Total:
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   

Tired of using placehold.it for your placeholder images prototyping demo page with temporary filler images? Today I'm going to introduce a fancy jQuery plugin called PixelHoldr that allows you to get placeholders to fill the container with random images from flickr.com based on specific keywords. You can also use the plugin to display your random flicker images on your website.

Basic Usage:

1. Create a div container that will be filled with images from flickr.

<div class="demo" style="width: 300px; height: 200px;">kitten</div>

2. Include jQuery javascript library and PixelHoldr plugin on the web page.

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="pack/jquery.pixelholdr.pack.js"></script>

3. Initialize the plugin. Flcikr API Key is required.

<script>
$(document).ready(function(){
$(".demo").pixelholdr({
flickrKey:'YOUR API KEY'
});
});
</script>

4. Available options.

<script>
$(document).ready(function(){
$(".demo").pixelholdr({
flickrKey:'YOUR API KEY'
flickrBaseURL: 'http://api.flickr.com/services/rest/',
flickrSafeSearch: 1, // Can be used to disable safe search.
showDimensions: true, // Overlays dimensions of each image
dimensionsFontSize: '40px', // Allows you to change the font size of the dimensions displayed
dimensionsColor: '#FFFFFF' // Allows you to change the color of the dimensions displayed
});
});
</script>

This awesome jQuery plugin is developed by itslenny. For more Advanced Usages, please check the demo page or visit the official website.