Backstretch-Iframe

Backstretch is a simple jQuery plugin that allows you to add a dynamically-resized, slideshow-capable background image to any page or element. The image will stretch to fit the page/element, and will automatically resize as the window/element size changes.

Setup

Include the jQuery library (version 1.7 or newer) and Backstretch plugin files in your webpage (preferably at the bottom of the page, before the closing BODY tag):

Options

Name	Description	Type	Default
centeredX	The ratio of the width/height of the image doesn't always jive with the width/height of the window. This parameter controls whether or not we center the image on the X axis to account for the discrepancy.	Boolean	true
centeredY	This parameter controls whether or not we center the image on the Y axis to account for the aforementioned discrepancy.	Boolean	true
fade	This is the speed at which the image will fade in. Integers in milliseconds are accepted, as well as standard jQuery speed strings (slow, normal, fast).	Integer or String	0
duration	The amount of time in between slides, when using Backstretch as a slideshow, expressed as the number of milliseconds.	Integer	5000
iframe	Whether to create an Iframe element instead of an Img element.	Boolean	false

##Example Object

$.backstretch([
  'path/to/image.svg',
], {fade: "slow", useSnap: true, iframe: true});