0

当输入字段处于焦点时，我有很多代码将标签设置为 0.5 不透明度。现在，如果可能，我想将其设置为 0（100% 不可见）。

有人可以帮忙吗？

这是我的小提琴：http: //jsfiddle.net/d8Apy/5/

我的HTML：

<div class="fieldgroup">
    <label for="name">Name</label>
    <input type="text" id="name" name="name">
</div><!--/.fieldgroup-->

我的CSS：

* {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    font-family: Arial;
}
.fieldgroup {
    position: relative;
}
input[type='text'],
label {
    padding: 5px;
    font-size: 16px;
    line-height: 16px;
    margin: 0;
    height: 30px;
    color: #fff;
    display: block;
}
input[type='text'] {
    border: none;
    background: green;
}

我正在使用这个 jQuery 插件： http: //fuelyourcoding.com/in-field-labels/

非常感谢任何指针:-)

4

5 回答 5

2

现场标签代码中有一行代码说...

$.InFieldLabels.defaultOptions={fadeOpacity:0.5,fadeDuration:300,labelClass:'infield'};

将此更改为...

$.InFieldLabels.defaultOptions={fadeOpacity:0.0,fadeDuration:300,labelClass:'infield'};

fadeOpacity:0.5到fadeOpacity:0.0

于 2013-07-19T16:00:41.480 回答
0

有一个名为的 html 属性placeholder可以做到这一点。但是，我不确定您是否可以对其应用淡入淡出效果。编辑： css 过渡可能是可能的，并且：Change an HTML5 input's placeholder color with CSS，但它相当可怕。

<input type="text" name="fname" placeholder="First name">

输入[名称：fname]：活动{颜色：绿色}

于 2013-07-19T16:01:56.613 回答
0

当您将插件应用到您的标签时，您可以通过传入一个选项对象来设置不透明度，如下所示：

$("label").inFieldLabels({ fadeOpacity:0.0 });
于 2013-07-19T16:04:10.320 回答
0

Javascript

$(document).ready(function() {
$("#name").focus(function(){

$('#lblname').css({'opacity':'0'});

});
   });

编辑淡化效果

$(document).ready(function() {
$("#name").focus(function(){

$("#lblname").animate({ 'opacity':'0'},350);

});
   });

HTML

<div class="fieldgroup">
<label for="name" id="lblname">Name</label>
<input type="text" id="name" name="name">
</div><!--/.fieldgroup-->
于 2013-07-19T16:06:59.320 回答
0

虽然不是每个插件开发人员都实施，但良好的做法是提倡插件接受选项对象。虽然不是很清楚，但您可以覆盖 fadeOpacity 和 fadeDuration 选项。

要解决您的问题，只需传入一个指定 fadeOpacity 的选项对象，如下所示：

$(document).ready(function(){
    $('label').inFieldLabels({fadeOpacity: 0.0});
});
于 2013-07-19T16:29:16.927 回答