Skip to content

Fullscreen background is a small jQuery plugin that allows you to create fullscreen background.

Notifications You must be signed in to change notification settings

sergiososasr/Fullscreen-Background-jQuery-plugin

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

4 Commits
 
 
 
 
 
 
 
 

Repository files navigation

#Fullscreen Background - jQuery plugin

Fullscreen background is a small jQuery plugin that allows you to create fullscreen background.

Article on Gaya Design

View the demo page


##How to use:

  1. Include jQuery on your webpage

  2. Have the following structure in your HTML:

     <div class="content">
     	Content goes here
     </div>
     <div id="background-image">
     	<img src="path/to/img.jpg" alt="" width="800" height="600" />
     </div>
    
  3. Then, in your CSS. Make sure the content is absolute and has a higher z-index than 1.

  4. Add the following line you Javascript file:

     $("#background-image").fullscreenBackground();
    
  5. DONE!

There are also a few options available:

selector (default: "img")
The selector that will be used when digging through the element you're calling the function on.

fillOnResize (default: true)
Set to true if the image has to resize to the screen if the screensize changes. I think most will leave this set to true.

defaultCss (default: true)
Set to true if you want to add some standard CSS to the elements. If you are experiencing problems you can set this to false and do the CSS in your own stylesheet.

About

Fullscreen background is a small jQuery plugin that allows you to create fullscreen background.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • JavaScript 68.3%
  • HTML 25.4%
  • CSS 6.3%