function readOnly(count){ }
Sign Up ›
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
Learn More

Browse by Topic
ShowAll Questionssorted byDate Posted
+ Start a Discussion
Brice Mbouani 9Brice Mbouani 9 

Salesforce1 App: Background Image not showing

Hi guys,

I've a very weird behavior right there.

The lightning component is basically a div with a background image using inline CSS  (as the dynamic image URL is fectched from database using soql) :
  
<div class="sc-card__image-container" style="{! 'background: linear-gradient(to bottom, transparent, #000000b8), url(' + v.thumbnail + ') no-repeat center;background-size: cover'}"> 
... </div>

When i test from Salesforce Desktop or & Mobile device simulator using Chrome, the lightning component is perfectly showing from.

But from Salesforce1 app on Android,  the background image does not show at all...
Do you have any idea what's wrong? Does it come from using inline CSS? If yes, how could i do this in a proper way?
​​​​​​​
Thank you

 
Raj VakatiRaj Vakati
Try like this
  
<aura:attribute name="backgroundImageURL" type="String" default=""/>
    <aura:handler name="init" value="{!this}" action="{!c.doInit}"/>   
    <div style="{!'position: relative; height: 30vh; background:' + v.backgroundColor + ' url(' + v.backgroundImageURL +') no-repeat;background-position: center;background-size: cover;'}">
        
    </div>
  
doInit : function(component, event, helper) {
        var url = $A.get('$Resource.aaaaaaaaaaaaaa');
        component.set('v.backgroundImageURL', url);
    }

https://developer.salesforce.com/forums/?id=9060G0000005bFEQAY

https://salesforce.stackexchange.com/questions/193958/how-to-add-background-image-to-lightning

https://www.forcetalks.com/salesforce-topic/how-to-add-background-image-to-salesforce-lightning-component-in-community/
Brice Mbouani 9Brice Mbouani 9

Thanks for reply, that didn't make it work, i still don't have any image appearing...
Just for info, i'm not using a static resource for the image but an attachment fetched from the database using soql. I also precise my previous code works perfectly from Salesforce desktop or Salesforce responsive app...any other idea?

Thanks!