Fix image on Safari browser
I use Safari to browse the net, i need to display an image as the background, my problem is that i want the image to be fixed and the text still scrollable. My code that doesn't work is this :
<html>
<head>
<开发者_StackOverflow;style type=text/css>
body{background-image:url('background.png');
background-repeat:no-repeat;
background-attachment:fixed;
}
</style>
</head>
<body>My text goes here</body>
</html>
with this code, i have both the image and the text scrollable.
Not entirely sure what's going on, as your code looks fine. Maybe you don't actually want it fixed? Fixed means the image wont move at all as you scroll, is that what you want?
I set up a JSFiddle which works fine. The only thing I did differently is declare all the info in the shorthand background property:
body {
background: url(http://2.bp.blogspot.com/-xpgIOttwTTg/TWRni-cC-tI/AAAAAAAAA-o/9GMqFyMnQCY/s1600/african-elephant2.jpg) repeat fixed;
}
And the JSFiddle: http://jsfiddle.net/jackfranklin/HYagh/
Checked & it works fine in Safari.
EDIT - now I know you're talking about Mobile Safari, position:fixed AND background-attachment:fixed; is not supported in iOS Safari up to iOS4, however is is supported in the upcoming iOS5.
加载中,请稍侯......
精彩评论