Chrome中的Plupload定位問題

我正在使用plupload，通過AJAX動態加載，並且此表單還具有驗證碼圖像。我正在努力使plupload墊片正確定位。然後我發現了一個解決方案，幾乎可以在所有的瀏覽器上運行，但Google Chrome除外。這裏是我的解決方案：Chrome中的Plupload定位問題

<span id="upl_container" style="position:relative;"> 
    <input type="button" id="my_button" value="Click me to upload something" /> 
</span>

在上傳設置我設置：

 browse_button : 'my_button', 
     container : 'upl_container',

現在，這使墊片被絕對定位在一個相對的父母，在父母（跨度）是完全相同的大小按鈕（我無法使用div，因爲它佔用了其父文件的100％寬度，然後plupload在所有瀏覽器上都有定位問題）。

當我檢查在Firefox（它被正確定位）的plupload勻場設置，我看到以下內容：

element.style { 
    background: none repeat scroll 0 0 transparent; 
    height: 28px; 
    left: 0; 
    position: absolute; 
    top: -4px; 
    width: 78px; 
    z-index: 99999; 
}

，但在Chrome它讓我看到：

element.style { 
position: absolute; 
background: transparent; 
z-index: 99999; 
top: 0px; 
left: 146px; 
width: 70px; 
height: 23px; 
background-position: initial initial; 
background-repeat: initial initial; 
}

顯然，剩下的財產太大了。

現在我不在乎它是否是一個bug，我只是想找到一些解決方法如何強制plupload的左側爲0.我試圖添加一個Javascript代碼，將左側設置爲0初始化，刷新，PreInit回調plupload，但這並沒有幫助，左側無論如何跳轉到146px。

有沒有辦法強制墊片的左側爲0px？

（順便說一下，我已經將Flash設置爲默認的plupload運行時，並回退到HTML4和HTML5）。

來源

2011-10-28 JustAMartin

好了，我就用下面的醜陋的代碼：

uploader.bind('Refresh', function(up) { 
    $('#'+up.settings.container + ' > div').css('left',0); 
    $('#'+up.settings.container + ' > div').css('top',0); 
    $('#'+up.settings.container + ' > div').css('width','100%'); 
    $('#'+up.settings.container + ' > div').css('height','100%'); 
    $('#'+up.settings.container + ' > form').css('left',0); 
    $('#'+up.settings.container + ' > form').css('top',0); 
    $('#'+up.settings.container + ' > form').css('width','100%'); 
    $('#'+up.settings.container + ' > form').css('height','100%'); 
    $('#'+up.settings.container + ' > div').children().css('left',0); 
    $('#'+up.settings.container + ' > div').children().css('top',0); 
    $('#'+up.settings.container + ' > div').children().css('width','100%'); 
    $('#'+up.settings.container + ' > div').children().css('height','100%'); 
    $('#'+up.settings.container + ' > div').children().css('font-size','20px');// default is 999px, which breaks everything in firefox 
})

而且耶！它適用於flash，htm5，htm4 runimes，在Chrome，Firefox，IE7，IE9上都進行了測試。最後，墊片就位。

來源

2011-10-29 20:56:38 JustAMartin

男人，非常感謝這一個。它節省了我的一天:) –

你可以鏈接這些，所以你不必每次都重新選擇它們，就像 '$（'＃'+ up.settings.container +'> div'）。children（）。css ''height'，'100％'）。css（'font-size'，'20px'）' – Walf

我有問題，墊片不在動態加載和切換內容的正確位置。

$('#my_button').mouseenter(function() { 
    uploader.refresh(); 
});

足以解決它。

來源

2011-12-22 06:50:58 Walf

不幸的是，使用1.5.5版本，它不工作，雖然它應該（在plupload論壇上閱讀它）。我已經調用destroy（），然後再次重新啓動對象...不是最好的解決方案，也不是最資源友好的！ – StefanNch

Chrome中的Plupload定位問題

回答

相關問題