fileAPI (fileReader / dataURL) で入力 (type="file") を使用して、png (透過性あり) 画像を取得し、Web サイトに表示します。これはデスクトップでうまく機能します。ボタンをクリックし、画像を参照して選択すると、サイトに表示されます。
iOS iPhone (他の iOS デバイスではテストされていません) では、ボタンをクリックすると、ブラウザに写真を撮るか、カメラ ロールから画像を選択するオプションが表示されます。カムロールで画像を選択すると、白い背景で表示されます。しかし、これは透過性を持つpng 24であり、その背景はそこにあるべきではありません(デスクトップのように)。
おそらくカメラロールが画像の透明度を削除することに問題があることがわかりました。だから、誰かが html 5 ファイル API を使用して iPhone から透明な png を取得したことがあるかどうか疑問に思っています。
注：ドロップボックス（画像をカムロールにコピーできる他のアプリ）を使用してみましたが、png画像の透明度が失われないことを期待していますが、サイトにインポートされたときにすべての画像が迷惑な背景で終わってしまいました.
これは、ファイル API 経由で画像を取得するために現在使用しているコードです。
function init() {
var bHaveFileAPI = (window.File && window.FileReader);
document.getElementById("inputid").addEventListener("change", onFileChanged);
}
function onFileChanged(theEvt) {
var thefile = theEvt.target.files[0];
var reader = new FileReader();
reader.onload = function (evt) {
var resultdata = evt.target.result;
$('<img>')
.attr('title', thefile.name)
.attr('src', evt.target.result)
.prependTo('#imgin');
}
reader.readAsDataURL(thefile);
}
window.addEventListener("load", init);