我希望用戶能夠上傳圖片以用作其個人資料背景(用戶#顯示)。查看具有該功能的某些網站(例如Twitter)的源代碼,似乎爲用戶分配了一個html正文標記,並且該正文標記的相應CSS背景圖像鏈接到了他們上傳的圖像。用戶上傳的背景?
任何想法,我可以做到這一點? (注意:我目前使用回形針進行圖片上傳,但會將其與Amazon S3 /類似服務集成)
我想過從我的用戶控制器向CSS文件/腳本注入一個ruby實例變量,以便它將是動態的,但我不知道這是否可能。可能有更好的方法。
我希望用戶能夠上傳圖片以用作其個人資料背景(用戶#顯示)。查看具有該功能的某些網站(例如Twitter)的源代碼,似乎爲用戶分配了一個html正文標記,並且該正文標記的相應CSS背景圖像鏈接到了他們上傳的圖像。用戶上傳的背景?
任何想法,我可以做到這一點? (注意:我目前使用回形針進行圖片上傳,但會將其與Amazon S3 /類似服務集成)
我想過從我的用戶控制器向CSS文件/腳本注入一個ruby實例變量,以便它將是動態的,但我不知道這是否可能。可能有更好的方法。
我已實施項目中的類似的東西。我將闡述這個概念並給出一個代碼示例。我會讓你理解邏輯或者採取一些代碼示例來適應你的系統實現。
我會用這個幫手。
在應用程序/視圖/佈局/ application.html.erb
<head>
...
</head>
<body style="<%= show_user_bg %>">
...
</body>
在應用程序/傭工/ application_helper.rb
module ApplicationHelper
def show_user_bg
"background:transparent url(#{@user.background_image}) no-repeat fixed left top;"
end
end
只要確保你的用戶模型有background_image列和這個設置。
使用助手使其更加動態和更清潔。例如,您可以投入條件:
module ApplicationHelper
def show_user_bg
# Show user background
if user_signed_in?
"background:transparent url(#{@user.background_image}) no-repeat fixed left top;"
# Otherwise, show a default background image
else
"background:transparent url('/images/default_bg.png') no-repeat fixed left top;"
end
end
end
希望有所幫助!
有很多種方法可以做到這一點。我見過谷歌搜索頁面。它在html主體的底部添加了一個圖像標籤,其絕對位置爲0,0,並將索引設置爲-2。
另一種方法是,在身體和你的主div的背景圖片,你可以做到這一點使用內聯CSS屬性像
<body style="background-image: 'url(<%= user_image -%>)'">
其中user_image是計算的背景圖像的URL爲當前用戶的一個輔助方法,這應該也處理默認圖像,即如果用戶沒有選擇任何圖像,那麼它應該返回一個默認圖像,可能是一個透明的圖像。
由於它與數據相關,因此我只是在視圖中使用內嵌式樣式。
假設控制器已經加載模型實例爲@profile
有叫background_image
,回形針附件屬性...
<body style="background-image:url(<%= @profile.background_image.url %>)">
...
</body>
非常感謝您的幫助!工作完美,有沒有什麼辦法可以爲用戶頁面設置默認背景?沒有任何背景圖片上傳用戶配置文件的背景爲白色,但對於所有其他頁面,您的「其他」頁面會出現,並且會出現默認背景 – ahuang7 2011-04-15 01:39:04
在幫助程序中,您可以添加其他條件以檢查@ user.background_image.blank?如果是,則顯示默認背景圖像。試一試 :-) – 2011-04-15 06:42:41