Scrolling Background Image - Post ID...

User 1984189 Photo


Registered User
7 posts

It seems like an easy enough thing to do but I havent been able to figure it out using the Visual Editor and havent found anything that works online.

The background of my site is an image but I want it to scroll with the page. Is this possible inside the visual editor or do I have to insert a piece of code using the html editor?

Thanks.
User 355448 Photo


Ambassador
3,144 posts

Jesse,

Are you wanting to have something like a logo that always stays centered on the browser page so that as you scroll, the page content moves up and off screen while the logo remains centered?

If so, you need to use CSS and the code which goes in the head of the html code will look like this:

<style type="text/css">
body {
background-image: url('logo.jpg');
background-repeat: no-repeat;
background-attachment: fixed;
background-position: center center;
}
</style>


If I failed to understand, let us know and someone can try again.
User 1984189 Photo


Registered User
7 posts

I tried using your code in the html editor and I cant get it to display the image. I did change the logo.jpg to a file that is on my comp. Is there a background setting I need to have set in the VSD that wont get in the way of this code? Currently under Page Properties in the VSD the background is set to solid white, default.
User 282670 Photo


Registered User
3,940 posts

Hi Jesse,
In VSD you would place that code under the edit > edit header, then on the page itself change the background to the image used in the page properties below the solid color, save it and that should work for you. preview and let us know :)
with Bill's code I made this example:
http://myofficialnewbie.com/VSD/
click on misc then one of the links there, and scroll




User 1984189 Photo


Registered User
7 posts

Awesome, thats exactly what I was looking for. Thank you both!

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.