2015-10-01 84 views
0

背景:我有一個瀏覽按鈕(<input type="file"/>)和一個自定義按鈕。我將自定義按鈕的點擊事件鏈接到目前爲止工作的瀏覽按鈕的點擊事件。現在我只需要隱藏輸入的原始文本框。嘗試隱藏瀏覽按鈕時發生奇怪的灰線

但是,這是我的問題:當我試圖隱藏控制,有一個奇怪的灰色車道,留下來。我嘗試了很多方法使它消失,但它似乎是一個奇怪的bug,因爲它在我隱藏之前出現在控件上的時候很笨拙。這裏是控制之前,我試圖掩蓋它:

enter image description here

後:

enter image description here

到目前爲止,我嘗試: - 設置CSS屬性頂:-10000px,能見度:隱藏,不透明度:0,寬度:0px等

有沒有人有過這個bug /問題?

+0

可以分享你的演示鏈接嗎? –

+0

嘗試顯示:無; – pptaszek1990

+0

@ pptaszek1990試過了,不起作用=(。這裏是小提琴https://jsfiddle.net/zwaefdfh/1/ – MacGruber

回答

0

好的,所有的評論,我最終找到了解決方案。

HTML:

<div class="relative-content"> 
      <input class="inputToCover" id="file" type="file"/> 
</div> 

CSS:很多大家

.inputToCover 
{ 
    visibility: hidden; 
} 

.ui-input-text 
{ 
    border: 0px; 
    box-shadow:inset 0px 0px 0px 0px; 
} 

感謝您的快速解答。

1

看起來這是從jQuery Mobile的CSS來:

.ui-body-a, .ui-page-theme-a .ui-body-inherit, html .ui-bar-a .ui-body-  inherit, html .ui-body-a .ui-body-inherit, html body .ui-group-theme-a .ui-body-inherit, html .ui-panel-page-container-a { 
background-color: #fff; 
border-color: #ddd; 
color: #333; 
text-shadow: 0 1px 0 #f3f3f3; 
    } 

邊框是給你的問題。

做這樣的事情:

.ui-body-a, .ui-page-theme-a .ui-body-inherit, html .ui-bar-a .ui-body-inherit, html .ui-body-a .ui-body-inherit, html body .ui-group-theme-a .ui-body-inherit, html .ui-panel-page-container-a { border: none; } 

這應該解決您的問題。

+0

是的,我父母沒有可能會影響這種控制的邊框屬性 – MacGruber

+0

你可以把代碼扔到一個小提琴(http://jsfiddle.net/)和生病了看看它?還有,它是在任何瀏覽器,你得到的問題,或只有一個? – Blake

+0

我在主要評論和IM即時聯繫使用IE10(沒有選擇...) – MacGruber

相關問題