IE中的持久占位符

我使用我的login.aspx文件为RDWeb门户设计了一个ms-input-placeholder 。 我想要在每个用户名和密码textInputField上实现持久占位符。 我怎样才能做到这一点?

这里是一些工作/示例代码,我添加了样式我的用户名和密码字段。 我无法以实现永久性占位符的方式对其进行修改(占位符始终显示,即使在焦点上,除非文本框具有文本)。

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

试试我的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();
链接地址: http://www.djcxy.com/p/70579.html

上一篇: Persistent Placeholders in IE

下一篇: Exclude placeholders on validation in IE8