我修改這個codepen筆https://codepen.io/dsholmes/pen/pyeeVQ?q=responsive%20popup&limit=all&order=popularity&depth=everything&show_forks=falseJavaScript和CSS屬性的HTML文本字段不工作
,並創建了自己的形式在這個codepen筆 https://codepen.io/eilufoye/pen/RZEvMz
我遇到的問題是,在其他文本框輸入時除名稱外,佔位符/標籤不會消失。
/* ------------------------- */
/* Contact Form Interactions */
/* ------------------------- */
$('#contact').on('click', function(event) {
event.preventDefault();
$('#contactblurb').html('Questions, suggestions, and general comments are all welcome!');
$('.contact').addClass('is-visible');
if ($('#name').val().length != 0) {
$('.name').addClass('typing');
}
if ($('#email').val().length != 0) {
$('.email').addClass('typing');
}
if ($('#message').val().length != 0) {
$('.message').addClass('typing');
}
});
該代碼處理標籤交互
/* ------------------- */
/* Contact Form Labels */
/* ------------------- */
$('#name').keyup(function() {
$('.name').addClass('typing');
if ($(this).val().length == 0) {
$('.name').removeClass('typing');
}
});
$('#email').keyup(function() {
$('.email').addClass('typing');
if ($(this).val().length == 0) {
$('.email').removeClass('typing');
}
});
$('#message').keyup(function() {
$('.message').addClass('typing');
if ($(this).val().length == 0) {
$('.message').removeClass('typing');
}
});
我怎樣才能使「型號」,「諾西」,「電子郵件」和「數量」標籤/佔位浮子開始打字時離開像「名稱」呢?全部獨立。 同樣我怎樣才能使「消息」像「額外音符」一樣獨立地左浮動?
我知道這不是什麼 – Oqhax
它的意思表示要讓它左浮動 – Oqhax
我認爲它很明顯說不上 – Oqhax