JS only seems to work sometimes

[warby12]

Hi, I've done this site: [michelleandandrew.net...]
and it has a full size fixed image background.
Unfortunately, the image doesn't seem to resize up to window size every time. On a control + F5 refresh the resize doesn't occur. Is this fixable?

[Fotiman]

Try moving this to just before the closing </body> tag:

<script>
  $.backstretch("images/beach-nsw.jpg");
</script>

[birdbrain]

Hi there warby12,

you could, of course, just dump the javascript and use CSS instead. ;)

body {
    font: 120%/1.4 'century gothic', verdana, arial, helvetica, sans-serif;
    margin: 0;
    padding: 0;
    color: #1b1b1b;
    background-color: #42413C;
    background-image: url(images/beach-nsw.jpg);
    background-repeat: no-repeat;
    background-position: 0 0;
    background-attachment: fixed;
    background-size: 100% 100%;
 }

birdbrain

[Fotiman]

A CSS-only solution is good advice. Note, IE8 doesn't support background-size, so if you need to support that browser you won't be able to use CSS only. Also, you'll want to include -webkit-background-size for Android 2.1 - 2.3 support.

[warby12]

Thans All! I have it working pretty well now except in Iphone but I'm going to have to leave it there. I really appreciate your help!

[rainborick]

You can add a lot of the popular CSS3 features to older versions of IE with CSS3 PIE [css3pie.com].