解決BootStrap Fileinput手機(jī)圖片上傳顯示旋轉(zhuǎn)問(wèn)題
最近因?yàn)轫?xiàng)目需要用到了bootstrap fileinput的插件，在使用蘋(píng)果手機(jī)上傳圖片預(yù)覽時(shí)，發(fā)現(xiàn)圖片方向和手機(jī)本地存儲(chǔ)方向不一致問(wèn)題。后來(lái)通過(guò)查詢資料了解圖片具有EXIF(Exchangeable Image File Format)旋轉(zhuǎn)屬性標(biāo)識(shí)，fileinput對(duì)旋轉(zhuǎn)進(jìn)行了處理。預(yù)覽圖片顯示的為電腦圖片存放方向。
用iPhone手機(jī)通過(guò)home鍵朝向四個(gè)不同的方向進(jìn)行拍照后，上傳照片顯示與預(yù)覽圖片方向并不一致。有點(diǎn)不明白其中緣由，后來(lái)發(fā)現(xiàn)了規(guī)則，只有Home鍵朝下和朝上的時(shí)候才會(huì)發(fā)現(xiàn)顯示不一致問(wèn)題。解決方案如下：
fileinput.css、fileinput.min.css文件中，css樣式旋轉(zhuǎn)角度存在問(wèn)題，修改以下樣式就可以啦。Home鍵朝下拍攝
.rotate-6 {
/*transform: rotate(90deg);原代碼*/
transform: rotate(270deg);
}
Home鍵朝上拍攝
.rotate-8 {
/*transform: rotate(270deg);原代碼*/
transform: rotate(90deg);
}
以上所述是小編給大家介紹的BootStrap Fileinput手機(jī)圖片上傳顯示旋轉(zhuǎn)問(wèn)題，希望對(duì)大家有所幫助，如果大家有任何疑問(wèn)請(qǐng)給我留言，小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持！
相關(guān)文章
這篇文章主要介紹了基于原生JS封裝的Modal對(duì)話框插件的示例代碼,本文給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2020-09-09
由 element.appendChild(newNode) ,談開(kāi)去
由 element.appendChild(newNode) ,談開(kāi)去...2006-11-11
JS動(dòng)態(tài)添加與刪除select中的Option對(duì)象(示例代碼)
本篇文章主要介紹了JS動(dòng)態(tài)添加與刪除select中的Option對(duì)象(示例代碼) 需要的朋友可以過(guò)來(lái)參考下，希望對(duì)大家有所幫助2013-12-12
關(guān)于Iframe父頁(yè)面與子頁(yè)面之間的相互調(diào)用
下面小編就為大家?guī)?lái)一篇關(guān)于Iframe父頁(yè)面與子頁(yè)面之間的相互調(diào)用。小編覺(jué)得挺不錯(cuò)的，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧，祝大家游戲愉快哦2016-11-11
本文主要介紹了DOM事件的相關(guān)知識(shí)。具有很好的參考價(jià)值，下面跟著小編一起來(lái)看下吧2017-02-02
JavaScript lodash常見(jiàn)用法系列小結(jié)
本篇文章主要介紹了JavaScript lodash用法小結(jié)，非常不錯(cuò)，具有參考借鑒價(jià)值，對(duì)于Javascript lodash教程感興趣的同學(xué)可以參考一下2016-08-08
JavaScript實(shí)現(xiàn)寫(xiě)入文件到本地的方法【基于FileSaver.js插件】
這篇文章主要介紹了JavaScript實(shí)現(xiàn)寫(xiě)入文件到本地的方法,結(jié)合實(shí)例形式分析了基于FileSaver.js插件實(shí)現(xiàn)保存文件到本地的相關(guān)操作技巧,并附帶FileSaver.js插件完整源碼,需要的朋友可以參考下2018-03-03
setTimeout函數(shù)兼容各主流瀏覽器運(yùn)行執(zhí)行效果實(shí)例
setTimeout是一個(gè)很不錯(cuò)的函數(shù)，網(wǎng)站頁(yè)面前端工程師經(jīng)常將其用于幾秒后執(zhí)行的動(dòng)作，下文要講的setTimeout可以很好地兼容IE6，7,8,9以及谷歌等主流瀏覽器2013-06-06
關(guān)于js獲取radio和select的屬性并控制的代碼
對(duì)于聯(lián)動(dòng)菜單大家都不會(huì)陌生了，但是這還是我第一次寫(xiě)聯(lián)動(dòng)的了。原理很簡(jiǎn)單，但是自己寫(xiě)起來(lái)就感覺(jué)還是有點(diǎn)難度的了2011-05-05
JavaScript使用cookie實(shí)現(xiàn)記住賬號(hào)密碼功能
這篇文章主要介紹了JavaScript使用cookie實(shí)現(xiàn)記住賬號(hào)密碼功能,本文直接給出完整測(cè)試代碼,需要的朋友可以參考下2015-04-04