So that the image of the slide show image with an enlarged background does not cover the entire screen?

Question

There are many full screen subframe background scenarios. I am using this http://buildinternet.com/2011/07/supersized-3-2-fullscreen-jquery-slideshow/

I am trying to achieve an effect that, instead of a background image covering the entire screen, leaves 250px to the left of the screen (for a fixed sidebar), and the background fills the rest. It is important that the full width of the photo is displayed on the right side of the screen.

This is the site I'm working on. As you can see, the background shifts to the right across the width of the sidebar, but as a result, part of the background is cropped.

http://princeseafoodrestaurant.com/dev/

Any help would be appreciated!

Answer 1

According to this , you can do it yourself:

Should Supersized be Fullscreen? Nope! You can size by adjusting the #supersized styles in the CSS file. You will want to make all instances of position: fixed → position :. absolute

So change this:

#supersized {  
    display:block; 
    position:fixed; 
    left:0; 
    top:0; 
    overflow:hidden; 
    z-index:-999; 
    height:100%; 
    width:100%; 
}

:

#supersized {  
    display:block; 
    position:absolute;
    left:250px; 
    right:0;
    top:0; 
    overflow:hidden; 
    z-index:-999; 
    height:100%; 
}

Then change any other instances position:fixedto position:absoluteand you should be installed.

Answer 2

Use this:

#supersized {  
    display:block; 
    position:fixed; 
    left:0; 
    top:0; 
    overflow:hidden; 
    z-index:-999; 
    height:100%; 
    width:100%; 
    margin:0;
    padding:0
}