Очередной баг jQuery?
Не могу понять, то ли это баг jQuery или я что-то упустул?
<script src="http://code.jquery.com/jquery.min.js" type="text/javascript"></script>
<script>
$(function(){
var $input = $('input');
if($input != null) {
$($input).bind({
focus: function(){
$(this).val() == this.defaultValue && $(this).val('');
$($input).animate({width: $(window).width()-50+'px'}, 600, false);
},
blur: function(){
if(!$(this).val()){
$(this).val(this.defaultValue);
$($input).animate({width:'100px'}, 600, false);
}
}
});
}
});
</script>
<form name="" action="">
<input type="text" value="click" />
</form>
Как воспроизвести баг: Кликнув на поле что-то печатаем, стираем и у уводим фокус (клик в любом месте документа), затем опять переводим фокус на текстовое поле и вводим текст, после чего курсор в текстовом поле пропадает.... тут можно потестить: http://jsfiddle.net/YVSQJ/ |
мог в общем-то попроще и постандартнее привести пример (чтобы не было лишних подозрений). И сказать в каком браузере не работает. В ff точно баг. А что, это нормально, когда пропадает курсор? А с jQuery может быть так: кому могло прийти в голову сделать так. Эта их анимация мутна чуть более, чем полностью
<!doctype html>
<html>
<head>
<script src="http://code.jquery.com/jquery.min.js" type="text/javascript"></script>
</head>
<body>
<input type="text" value="click" />
<script type="text/javascript">
$('input').focus(function(){
$('input').animate({width: 200});
});
</script>
</body>
</html>
|
Да, в Firefox баг такой: наводишь курсор, что-нибудь печатаешь и даже можно не стирать просто фокус убираешь, а потом уже курсора не будет.
Бага не наблюдается в IE 8, Opera 11, Google Chrome 8.0.552.237, Safari 5.0. |
Самое интересное, что периодически отправляю им явные баги, но они их не могут воспроизвести, пришлось последний раз даже видео записать.
Цитата:
Есть у кого-нибудь идеи как это побороть (отказаться от JQuery не предлагайте, т.к. не в моей компетенции)? |
Нашёл темку которая к jquery не относится, но относится к инпуту.
|
в интернетах пишут, что надо с overflow экспериментировать, в частности, попробуй auto. Оно, наверняка, меняется в animate. Попробуй после анимации его изменить
p.s. google://disappear caret ff |
Цитата:
Цитата:
auto как раз не нужно, т.к. оно полосу прокрутки добавляет, пришлось сделать так:
div {
position: realative; /* обязательно */
overflow: hidden; /* обязательно */
/* width: икрементируется */
z-index: 100;
}
input {
width: 100%;
}
<div>
<input type="text" value="click" />
</div>
|
ну я ж говорю, что ты совершаешь много лишних движений...
<!doctype html>
<html>
<head>
<script src="http://code.jquery.com/jquery.min.js" type="text/javascript"></script>
</head>
<body>
<style type="text/css">
input { overflow: hidden; }
</style>
<input type="text" value="click" />
<script type="text/javascript">
$('input').focus(function(){
$('input').animate({width: 200});
});
</script>
</body>
</html>
|
Цитата:
|
| Часовой пояс GMT +3, время: 16:48. |