bootstrap-file-input

 

github:https://github.com/zhangkaitao/bootstrap-file-inputcss

 

爲bootstrap提供統一的文件上傳按鈕

試用了幾個相似的,不能知足需求,乾脆本身寫一個。
思路是:利用label完成輔助點擊file框,並把file框設置爲透明便可,很是簡單
可完美解決在ie中的「訪問限制」問題(即必須是用戶點擊才能進行文件上傳),且無位置偏移問題。html

使用方式

導入js和css便可,會自動查找file標籤執行初始化jquery

<script src="./js/bootstrap.file-input.js"></script>
<link href="./css/bootstrap.file-input.css" rel="stylesheet">

效果

Test XIB

其餘參考:

一、http://gregpike.net/demos/bootstrap-file-input/demo.html
確點:ie8(其餘版本未測試)下,可能在使用過程當中input位置有誤差
二、http://addyosmani.github.com/jquery-ui-bootstrap/extra.html#file-input
這個是jquery-ui-bootstrap的參考示例,確點也是ie的限制git

因此你們能夠根據個人思路改寫這兩個。github

 

github:https://github.com/zhangkaitao/bootstrap-file-inputbootstrap

相關文章
相關標籤/搜索