Баг пропадает input text при нажатии на него на Андроид

Cdelphi78

Баг. пропадает input text при нажатии на него на Андроид. Кто сталкивался, что то не могу понять с чем связано может быть. Текст соответвенно не ввести.
6 ответов

Cdelphi78

Скиньте ваш код и стили для input


Cdelphi78

<div class="search-wrap">
                        <div id="search-bl">
                            <input class="f-search" type="text" placeholder="search">
                        </div>
                        <div class="icon-b"><i class="fa fa-search"></i></div>
                    </div>
#search-bl {
    display: none;
    float: left;
    margin-right: 5px;
}
 
.search-wrap {
    float: right;
    transition: none 0s ease 0s;
}
 
.f-search {
    border: 1px solid #ff2868;
    border-radius: 20px;
}
 
.icon-b {
    cursor: pointer;
    float: right;
}
/* Small Devices, Tablets */
 
@media only screen and (max-width: 768px) {
 .fa.fa-search {
    font-size: 30px;
    vertical-align: middle;
    line-height: 33px;
    }
   .f-search {
        width: 98%;
        font-size: 26px;
        vertical-align: middle;
        line-height: 30px;
    }
}
/* Extra Small Devices, Phones */
 
@media only screen and (max-width: 480px) {
.search-wrap {
        float: none;
        width: 100%;
    }
    .fa.fa-search {
    font-size: 30px;
    vertical-align: middle;
    line-height: 33px;
    }
    #search-bl{
        width:85%;
    }
    .f-search {
        width: 98%;
        font-size: 26px;
        vertical-align: middle;
        line-height: 30px;
    }
}
skolm, вы знаете почему такое может происходить?есть идеиа как на андроид открыть инспектор в браузере


Cdelphi78

Думаю имеет смысл попробовать прописать для .f-search: состояния в active и focus и еще, вероятно высоту прописать.


Cdelphi78

skolm, спасибо.Попробую. Но мне не нужно ничего видоизменять что я туда пропишу то?Походу это что то из за скрипта который заставляет выезжать текстовое поле. Сможете разобраться почему он так влият. На компе же все нормально.
$('.icon-b').click(function() {
        //$( "#search-bl" ).slideToggle( "500");
        $( "#search-bl" ).toggle( "slide",{ direction: "right" });
        
    });
Никто не поможет? Ладно продублирую в раздел js.Никто не знает что ли?


Cdelphi78

Cdelphi78, либо я дурак, либо лыжи не едут Все прекрасно работает: РС / Андроид 4.4.2 (станд. браузер, Chrome), iOS. Работает даже на богом забытом Windows Phone 7.8Все что я заменил: Валидный html5 search:
<input type="search">
Обернул все в:
$( document ).ready(function() { });
Вот так у меня все выглядит:
<script>
$( document ).ready(function() {
    $('.icon-b').click(function() {
        $( "#search-bl" ).slideToggle( "500");
        $( "#search-bl" ).toggle( "slide",{ direction: "right" });
        
    });
});
</script>
<body>
<div class="search-wrap">
  <div id="search-bl">
  <input type="search" name="googlesearch" class="f-search" placeholder="search">
  </div>
  <div class="icon-b"><i class="fa fa-search"></i></div>
</div>


Cdelphi78

evikza, можно я вам в ЛС ссылку на сайт кину,поможете, не хочу просто чтобы в поисковики инфа ушла отсюда, сейчас вообщее как то странно ведет себя все.