IE中的持久佔位符

Question

我正在使用我的login.aspx文件爲RDWeb門戶樣式設計ms-input-placeholder。我想對每個用戶名和密碼textInputField執行persistent placeholders。我怎樣才能做到這一點？

這裏是一些工作/示例代碼，我添加了哪些樣式我的用戶名和密碼字段。我無法以實現永久性佔位符的方式對其進行修改（佔位符始終顯示，即使在焦點上，除非文本框具有文本）。

<style> 
    .textInputField:-ms-input-placeholder { 
     color: #999999; 
    } 
    .textInputField:focus { 
     background-color:yellow; 
    } 
</style> 

Answer 1

試試看我的Jquery插件。您發佈的內容在IE中無法正常工作。

它將在佔位符中輸入文本和密碼，並將它們轉換爲標籤以充當佔位符並使其持久。

這是帶有選項的動畫。可用選項爲focusOpacity，focusSpeed，& fadeSpeed。

只需從下面的小提琴鏈接複製並粘貼插件代碼即可。

Fiddle

HTML

<input id="username" type="text" placeholder="Username"> 
<input id="password" type="password" placeholder="Password"> 

CSS

.input-wrapper input { 
z-index: 9999; 
font-size: 14px; 
height: 20px; 
border: none; 
background: transparent; 
position: relative; 
display: inline-block; 
outline: none; 
} 

.input-wrapper { 
margin: 10px; 
width: 200px; 
border: 1px solid #000; 
vertical-align: middle; 
position: relative; 
display: block; 
} 

.input-wrapper label { 
z-index: 999; 
color: gray; 
font-size: 14px; 
font-family: arial; 
font-style: italic; 
height: 20px; 
line-height: 20px; 
padding-left: 3px; 
position: absolute; 
cursor: text; 
} 

腳本選項

$(document).labelPlaceholder({focusOpacity:.5,focusSpeed:150,fadeSpeed:50}); 

腳本使用默認值

$(document).labelPlaceholder();