IE中的持久占位符

Question

我正在用我的login.aspx文件为RDWeb门户设计一个ms-input-placeholder。我想实现每个用户名和密码textInputField持久占位符。我该怎么做呢?

这里是一些工作/示例代码我添加了样式我的用户名和密码字段。我不能以实现持久占位符的方式修改它(占位符总是显示，即使是焦点，除非文本框有文本)。

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

Answer 1

试试我的Jquery插件。你发布的那个在IE中不能正常工作。

它将接受文本和密码输入中的占位符，并将它们转换为标签，以充当占位符并使其持久。

这是带有选项的动画。可用的选项是focusOpacity, focusSpeed， &fadeSpeed .

从下面的链接中复制并粘贴插件代码。

小提琴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();