Skip to content
This plugin allows you to fill the background of a page with an image–all while maintaining the aspect ratio and gracefully handling window resizing.
JavaScript
Find file
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Failed to load latest commit information.
MIT-LICENSE.txt
README.md
birthday.jpg
demo.html
jquery.backgrounder.js

README.md

jQuery Backgrounder Plugin

This is the jQuery Backgrounder plugin. This plugin allows you to fill the background of a page with an image–all while maintaining the aspect ratio and gracefully handling window resizing.

How to use it

  • Include jQuery and the plugin file in your page
  • Add a div to your page which includes an image. The div can be set to display:none; if you'd like. I prefer fairly large images but any size will do.
  • Call the backgrounder() function on your div—preferably when the page loads.
  • Include the "element" option to apply it to a specific element (default is the body)
  • No CSS file is required
  • Use the demo.html page for guidance.

License

This little plugin is licensed under the MIT license. See the MIT-LICENSE.txt file for details. The image used in this example (birthday.jpg) is copyrighted (by me) and may not be used by you. Why would you want a picture of my kid, anyway?

Something went wrong with that request. Please try again.