Jump to content
Sign in to follow this  
urbanimatic

Background Positioning Issue

Recommended Posts

urbanimatic

Hello everyone, I have an issue with the background, the problem is that i need it when the screen resolution is lower or when resizing the browser window to move to the left instead of staying at the same position. Check this to understand what i mean: http://vimeo.com/34117524 ...i need it so users with smaller screens still be able to see a little bit of the surf boards. I'm using Full-Width Design Framework as the Site Design Mode in Design Control. And the background is placed at #page-canvas ...it can be placed in #page as well with the same result. Please advice, Stelios

Share this post


Link to post
Share on other sites
Jackey
Understand what you mean... Something like this? [url="http://golfclub-stippelberg.nl"]http://golfclub-stippelberg.nl[/url]

Share this post


Link to post
Share on other sites
Jackey
Your background needs to be 2560 pixels wide (you have to make concessions) and attached to the bottom of the page... The height you can decide for yourself but the smart thing to do is to smoothly blend the top into an even color and set that color to be the background color.

Share this post


Link to post
Share on other sites
Jackey
So...: Do not repeat Vertical Position in Percent: 100 Horizontal Positio in Percent: 50 Set Background Attachement: Fixed Don't supersize! Only the margin will be shown on an iPad but no unexpected things beyond that. You can also fix it to the center of the page (vertical position 50), and make the image about 1600 to 2000 pixels high. (maximum viewport). With your bleu ribbon you have to fix it to the top though (vertical position 0). And it will give some unexpected results on an iPad. (scales the background) Oops, my bad... I assumed you where using the Pagelines Framework 2.0, can't check if this works with PlatformPro.

Share this post


Link to post
Share on other sites
urbanimatic
Hi there, thank you for the quick response i can do this using platform pro but i'll have to code it myself but...i actually don't need this because what this does is resizing the background...what i need is the background moving to the left when the browser size is reduced.

Share this post


Link to post
Share on other sites
Danny
Hi Urbanimatic, Not sure if this will help you or not, but I did a search and found this: http://stackoverflow.com/questions/5809784/move-background-image-based-on-browser-width

Please search our forums, before posting!

Share this post


Link to post
Share on other sites
Jackey
Does that (the moving) not happen if you set the horizontal position to 50%? It should not scale the BG image... My duckies stay to the left edge of the Page, regardless the browser size ;) (not on iPad though)

Share this post


Link to post
Share on other sites
urbanimatic
Hi Jackie, you are right...don;t know how i missed that :) ....we try to to everything using manually and we forget how cool are the framework features.

Share this post


Link to post
Share on other sites
urbanimatic
Hi Danny, thanks for the look that's nice, i might use it for another project since i solved this issue.

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

Sign in to follow this  

×