geeked.out
Member
Posted 2 years ago #
I recently purchased a one page scrolling theme.
It is based on the 960 grid and uses jQuery.
My question is what is the best way to go about displaying a different background image for each "page" (section) on the one scrolling page?
I attempted a basic body class fix in the header.php file thinking that I could simply call each page using ".page-id-1" type code.
Unfortunately it calls on the first page or .home page and then there is no styling for the following pages.
Thanks for the suggestions in advance!
This is the theme:
http://themeforest.net/item/pixelstudio-an-elegant-scrolling-onepage-theme/full_screen_preview/126024
This is an example of someone using "multiple" backgrounds (two different repeating tiles alternating every other section):
http://solidgiant.com
These are the divs surrounding the different sections in the default theme:
div#section_home
div#section_portfolio
div#section_mywork
div#section_aboutme
div#section_elements
div#section_contact
The solidgiant customization involved adding new surrounding divs with 100% width around the section_portfolio, section_aboutme and section_contact areas so background image would extend.
geeked.out
Member
Posted 2 years ago #
Hi Mercime - thank you for the response!
So I would have to create new 100% width divs around each content area to insert multiple backgrounds.
Which file would I be modifying?
The stylesheet? would I modify the page.php file?
Thanks a million!
geeked.out, I wouldn't know as I don't have access to that premium theme. Best guess would be either home.php or index.php.
You would be modifying the style.css and that file rendering the code in that page. You would also need to include the background images for your sections called in style.css in your theme folder and upload to server.
