Welcome to WebmasterWorld Guest from 23.20.230.24

Forum Moderators: open

Message Too Old, No Replies

JS only seems to work sometimes

     
2:04 am on May 14, 2014 (gmt 0)



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?
1:30 pm on May 14, 2014 (gmt 0)

WebmasterWorld Senior Member fotiman is a WebmasterWorld Top Contributor of All Time 5+ Year Member Top Contributors Of The Month



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

<script>
$.backstretch("images/beach-nsw.jpg");
</script>
3:21 pm on May 14, 2014 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



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
3:40 pm on May 14, 2014 (gmt 0)

WebmasterWorld Senior Member fotiman is a WebmasterWorld Top Contributor of All Time 5+ Year Member Top Contributors Of The Month



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.
11:39 pm on May 14, 2014 (gmt 0)



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!
5:15 pm on May 15, 2014 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



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

Featured Threads

Hot Threads This Week

Hot Threads This Month