2016-04-02 16 views
3

Ich versuche, eine Rails 4 App zu machen, mit einem dynamischen Hintergrundbild.Rails 4 - dynamisches Hintergrundbild

Ich habe mehrere Beiträge auf SO gelesen, die sagen, dass es am besten ist, das Objekt in der CSS-Datei nicht zu definieren, weil es nicht zwischenspeichert. Ich habe versucht, es auf meiner Show-Seite wie folgt zu definieren - aber nichts rendert.

<div class="col-md-5 col-lg-4 vc-photo" style= 'background-image: url(<%= image_url @profile.user.avatar.profile.path if @profile.user.avatar? %>);' }>&nbsp;</div> 

Ich habe auch versucht (Pfad für die URL-Swapping):

<div class="col-md-5 col-lg-4 vc-photo" style= 'background-image: url(<%= image_url @profile.user.avatar.profile.url if @profile.user.avatar? %>);' }>&nbsp;</div> 

Wenn ich versuche, das Element im Codeinspektor die Kontrolle, kann ich sehen:

<div class="col-md-5 col-lg-4 vc-photo" style="background-image: url();" }="">&nbsp;</div> 

Sieht jemand was habe ich falsch gemacht?

+0

Sind Sie sicher, dass 'avatar' einen Wert hat? Wenn Sie es in <% = "xxx" if @ profile.user.avatar ändern? %> 'oder etwas ähnliches, bekommst du das' xxx' in der Ausgabe? – CupawnTae

+0

(Sie haben auch eine zusätzliche '}', die vom Browser in '} =" "' übersetzt wird, aber das hat nichts mit Ihrem Problem zu tun. – CupawnTae

+0

Hallo, die Seitenquelle zeigt:

 
Mel

Antwort

0

<div class="col-md-5 col-lg-4 vc-photo" style="background-image: url(<%= image_tag @profile.user.avatar.url if @profile.user.avatar.file? %>);">&nbsp;</div>

Versuchen Sie dies, wenn es funktioniert.

bearbeiten

<div class="col-md-5 col-lg-4 vc-photo" style="background-image: url(<%= image_tag @profile.user.avatar.url if @profile.user.avatar? %>);">&nbsp;</div>

Probieren Sie es ohne die Datei

ich das gefunden, die Ihnen helfen sollen: background images with carreirwave

+0

Hallo, das "Datei" -Bit erstellt eine Fehlermeldung, dass keine Methode für die Datei definiert ist. Ich habe das nicht in meiner App definiert. Die erste Antwort, die Sie gaben, funktioniert auch nicht. Danke jedenfalls – Mel

+0

Welche Art von Edelstein verwenden Sie zum Hochladen von Dateien? –

+0

Ich benutze Carrierwave – Mel

1

<div id="profile-photo" style="background-image: url(/assets/<%= @user.image.url(:thumb) %>)"> 

ersetzen arbeiten paaren Dies sollte die URL mit Ihren eigenen und nicht image_tag verwenden, weil Sie nur die URL nicht ein Bild wollen.