21285 Posts in 5732 Topics by 2602 members
|
Page:
1
|
Go to End | |
| Author | Topic: | 1423 Views |
-
Adding BannerImage to the CSS Background Image

10 February 2009 at 5:21am
I have set up a bannerimage in CMS for my pages but want to use it in the CSS in background-image element not img. When I use $BannerImage in css it brings in img tags and alt tags etc. So what I need is the image in its standard path format. Anyone have any idea how I can have a different background image on everypage?
-
Re: Adding BannerImage to the CSS Background Image

10 February 2009 at 7:18am
I will be able to help you if you can explain a bit more about how you tried to do this.
-
Re: Adding BannerImage to the CSS Background Image

11 February 2009 at 1:19am
I have setup a bannerimage to pages so a separate image can be uploaded for everypage as per imageupload tutorial. Now I want the image not to appear as an image in the page template using $BannerImage but want the image to be available using background-image in a style at the top of a template. ie:
<div style="background-image: url($BannerImage)"></div>
This is how I thought it would work but won't due to the img tags and stuff that is brought in.
I hope this is clearer.
I just need a simple path to the pages BannerImage.
-
Re: Adding BannerImage to the CSS Background Image

11 February 2009 at 1:54am
use this
<div style="background-image: url($BannerImage.URL)"></div>
-
Re: Adding BannerImage to the CSS Background Image

13 February 2009 at 12:24am
Excellent works like a dream thanks!!!
-
Re: Adding BannerImage to the CSS Background Image

13 February 2009 at 3:36am Last edited: 13 February 2009 3:36am
Hi Nivanka,
here is my question ;-)
Do you know how to get image width and height? I would like to set the image size when adding a a background image to a div block:
<div style="background-image: url($BannerImage.URL); width: $BannerImage.WIDTH(???)px"></div>
Any idea?
Thanks much!
patte -
Re: Adding BannerImage to the CSS Background Image

13 February 2009 at 4:40am
check this documentation, you will find all what you need there.
| 1423 Views | ||
|
Page:
1
|
Go to Top |


