В форме присутствует поле textarea
, поле обернуто в див, и для него задан фон, но при этом все равно в правом нижнем углу у textarea
остается треугольник (который каждый браузер отрисовывает по своему) http://jsfiddle.net/TANAn/12/
Как от него избавиться?
Также не получается задать для текста placeholder
свои параметры шрифта и цвета, как это можно сделать?
2 ответа
Треугольник получилось отключить, задав
.addComments form textarea{
resize: none;
}
Для содержимого textarea написан скрипт
<script type="text/javascript">
$(document).ready(function(){
$('.addComments form .message').html('Your Message...');
$('.addComments form .message').focus(function(){
$('.addComments form .message').empty();
});
});
</script>
но почему-то не происходит очистки textarea при фокусе. подскажите, почему?
вот новый вариант верстки http://jsfiddle.net/TANAn/16/
-
А это зачем? $('.addComments form .message').html('Your Message...');Для работы placeholder-а не нужны никакие дополнительные скрипты. "Стартовое" значение пропадает, когда начинаешь вводить данные в поле. Другое дело, что не во всех браузерах он работает. А если кроссбраузерное решение нужно, то placeholder как бы ни к чему, а всё можно в JS сделать. – Deonis 5 дек '12 в 21:29
-
P.S. Кстати, методами .html() и .empty(), вы попросту "убиваете" textarea. Уже после использования .html() - его просто не существует. – Deonis 5 дек '12 в 21:37
-
@Deonis а как задать стили для того текста, который по умолчанию отображается в textarea ? сейчас текст выводится с стилями браузера по умолчанию, а мне нужно сделать, чтобы он по внешнему виду был аналогичен текстам в инпутах. – Heidel 6 дек '12 в 14:40
-
Для визуализации placeholder
используйте:
input:-moz-placeholder { ... }
input:-ms-input-placeholder { ... }
input::-webkit-input-placeholder { ... }