Forum Support

Shape 5
November 29, 2021, 12:07:14 AM *
Welcome, Guest. Please login or register.

Login with username, password and session length
News: Shape 5 Forum
 
   Home   Help Search Login Register  
Pages: [1]
  Print  
Author Topic: Resize background image based on browser size  (Read 747 times)
morten44
Jr. Member
**
Offline Offline

Posts: 61



« on: August 21, 2012, 03:01:59 AM »

Hi
http://stcw.dk/
On this site i want to make it so the background picture can resize based on browser size.
There is a CSS3 code for this

Quote
html {
   background: url(images/background2.jpg) no-repeat center center fixed;
   -webkit-background-size: cover;
   -moz-background-size: cover;
   -o-background-size: cover;
   background-size: cover;
}

I have entered this code to template.css but nothing happens.
I then see that in the template properties you have a setting for body background.
I have tried to remove it but it pops straight backup.

How can I get to control the background picture using CSS in this template?
If not easy, can you suggest other template where its easier?

Kind regards
Morten
Logged
pmiddleton
Global Moderator
*****
Offline Offline

Posts: 2097



« Reply #1 on: August 21, 2012, 08:14:33 AM »

It's not impossible, but it really goes beyond the scope of these forums.

As a guide, though, try the following -

You would need to edit index.php to remove the calls made on backimage, as it is this function which takes the parameter from the template settings.

Then you'd need to edit template.css. You will see, at the very top, the body{ } section. This is where calls to background images are made.

For a little more guidance, take a look at template.css for a template that doesn't set the background image in the template settings. Cyan is one where the image is set in css.
Logged

Paul
------------
Shape 5 Team


- Using Firebug will save you so much time, frustration and forum questions:
http://getfirebug.com/


- Need some custom coding done on your site? Use our Shape 5 Hire a Coder program for free:
http://www.shape5.com/hire_a_coder/listauctions
morten44
Jr. Member
**
Offline Offline

Posts: 61



« Reply #2 on: August 22, 2012, 04:05:03 AM »

Hi
Thanks for your advise. That was all i needed.
Sometimes I can sit for hours trying to resolve something but then not possible as template spesific.
Thanks for your guide. I think I can understand that, if not I will check out Cyan

Cheers
Morten
Logged
pmiddleton
Global Moderator
*****
Offline Offline

Posts: 2097



« Reply #3 on: August 22, 2012, 06:51:12 AM »

Glad to help
Logged

Paul
------------
Shape 5 Team


- Using Firebug will save you so much time, frustration and forum questions:
http://getfirebug.com/


- Need some custom coding done on your site? Use our Shape 5 Hire a Coder program for free:
http://www.shape5.com/hire_a_coder/listauctions
Pages: [1]
  Print  
 
Jump to:  

Powered by MySQL Powered by PHP Powered by SMF | SMF © 2013, Simple Machines
Joomla Bridge by JoomlaHacks.com
Valid XHTML 1.0! Valid CSS!
Looking for the largest variety in template designs? Look no more. Never buy 1 theme again. Signups start at just $89 for access to all of our themes.
Send Us An Email
Please send us your questions and we will email you back as soon as we can. Product support questions should be posted in our support forums under the Help menu. Our staff will assist you from there.