#Start+ #DITBT {
position: absolute;
top:5px;
right:1160px;
left: 15px;-webkit-transform: translate3d(0px, 0px, 0px);
opacity: 0.5;
transition: opacity .25s ease-in-out;
-webkit-transition: opacity .25s ease-in-out; }
#Start:focus + #DITBT {
opacity:0;
}
<div class="input-field">
<input type="text" name="firstname" id="Start" maxlength="30" class="pad" required />
<label for="Start" id="DITBT">First name</label>
</div>
如果某些内容符合输入值,如何隐藏标签
答案 0 :(得分:1)
input::placeholder {
opacity: 0;
}
input:not(:placeholder-shown) ~ label {
display: none;
}
<div class="input-field">
<input type="text" placeholder="placeholder" name="firstname" id="Start" maxlength="30" class="pad" required />
<label for="Start" id="DITBT">First name</label>
</div>
答案 1 :(得分:-1)
$('input').on('input',function(){
if($(this).val() != '') {
$(this).parent().find('label').fadeOut();
} else {
$(this).parent().find('label').fadeIn();
}
});