數據URI不是CSS

工作，我有這樣的FileReader代碼數據URI不是CSS

for (var i = 0; i < files.length; i++) { 
    fileReader.onload = (function(file) { 
     return function(e) { 
      z = z + 40; 
      // Place the image inside the dropzone 
      var image = this.result; 
      $('#dropped-files').append('<div style="left: ' + z + 'px; background: url(' + image + ') cover;"> </div>'); 

     }; 
    })(files[i]); 
}

無論如何，我嘗試設置附加盒到剛剛上傳的圖片的背景。問題是它不起作用。數據URI存在，但我似乎無法讓它顯示爲背景！即使當我單擊檢查元素中的數據URI鏈接時，我也可以看到上傳的圖像，但它不會顯示爲背景圖像。

任何想法爲什麼？數據URI特別長，但是以基本數據開始，並且是base64，如果有幫助的話。

來源

2012-08-03 Johnny

演示或到該項目將幫助鏈接。唯一想到的是浮動div沒有內容給它任何寬度或高度。 – Jrod 2012-08-03 18:55:33

你的圖像變量的格式是什麼？只是前幾個字符應該沒問題。 – kzh 2012-08-03 18:56:20

嘗試在背景值的末尾刪除cover。我不知道你想要做什麼，但是加入它會讓Chrome拋出它的手，並說它不是一個有效的財產價值。

編輯：相反，使兩個聲明：

$('#dropped-files').append('<div style="left: ' + z + 'px; background: url(' + image + '); background-size: cover;"> </div>');

來源

2012-08-03 18:54:09 petschekr

['cover'是一個'background-size'屬性值]（http://whereswalden.com/files/mozilla/background-size/page-cover.html）。 – bPratik 2012-08-03 18:55:32

啊，我覺得現在這樣的傻瓜。顯然背景大小必須單獨設置。 – Johnny 2012-08-03 19:29:05

數據URI不是CSS

回答

相關問題