Try Now
More in this section

Forums / Designing & Styling / User selected background-image from SF assets?

User selected background-image from SF assets?

2 posts, 0 answered
  1. Nik
    Nik avatar
    10 posts
    06 May 2013
    01 Oct 2013
    Link to this post
    I'd like to have the ability for a stock image control added to a page to be able to make the selected image a background image instead.
    ie: The client is requesting a unique browser-wide hero image for each page. They want a 2000px+ wide image that will be centered with the site, and be able to easily change it. If done using a normal image widget, the end result will get a scroll-bar as soon as browser is below 2000px.
    Can this be done stock? Or very easily with a custom control?
  2. Jochem Bökkers
    Jochem Bökkers avatar
    787 posts
    13 Aug 2007
    02 Oct 2013 in reply to Nik
    Link to this post
    Hey Nik,

    You can build a simple custom control for this.
    Add a literal to it, use Thunder to add a designer, make it a guid and Image Selector.

    Then in your code behind, build out a style rule, which inserts the image as a background url.
    You could hardcode the styling, do it by means of a css class or extend the control for various options but the proper css rule set would be:
    background: url(thedynamicimage.jpg) no-repeat center center fixed;
     -webkit-background-size: cover;
     -moz-background-size: cover;
     -o-background-size: cover;
     background-size: cover;

2 posts, 0 answered