Home  >  Article  >  Web Front-end  >  All versions of browsers are compatible with local image preview_html/css_WEB-ITnose

All versions of browsers are compatible with local image preview_html/css_WEB-ITnose

WBOY
WBOYOriginal
2016-06-24 12:05:121174browse

1.IE browser

6: Directly obtain the value of the inputFile object and fill it into the src of the img tag
7: Due to browser security restrictions, the absolute path has been used directly. The image cannot be displayed. AlphaImageLoader filter skills are required (IE-specific)
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader (enabled=bEnabled, sizingMethod=sSize, src=sURL)
Post a blog explaining the use of filters
                                                                                                                     The above code is more practical:
        var imageUrl = document.selection.createRange().text;
        document.selection.empty();
            inputFile.src="http://qzs.qq.com/ac/b.gif")
img.src = "http://qzs.qq.com/ac/b.gif";
img.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true,sizingMethod=scale ,src='" imageUrl "')";

2 Modern browsers

 chrome 

Detect whether the browser supports the FileReader object

FileReaer.result returns the file content

      var reader = new FileReader();
                reader.readAsDataURL(self.inputFile.files[0]); ult;

FF
inputFile.files.item(0).gettAsDataURL(); // Supported under FF. No specific version is supported


They are all Code snippet.

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn