Koristin ovaj kod za da prikazim search kopce kao labela. Kada se klikne na njega, labela dobija pseudo klasa :focus i u taj trenutak se otvara input tekstualno polje.
Za da postignem ovo, koristim ovaj css:
.form-control.search-control {
width: 0;
}
.search-label:focus ~ .form-control.search-control,
.form-control.search-control:focus {
width: 315px;
}
Probljem je sto ovo ne radi na iPhone, iPad i drugi tableti i mobilni. Kako mogu da napravim da na touch vrz labelu se sluci isto sto se slucuje i na click, ta labela da dobije :focus ?
Code:
<form class="search-form" role="search">
<div class="input-group search-group">
<div class="input-group-btn">
<label for="search" class="search-label"></label>
<input type="text" class="form-control search-control" placeholder="Enter your search term..." name="search" id="search">
</div>
</div>
</form>
<form class="search-form" role="search">
<div class="input-group search-group">
<div class="input-group-btn">
<label for="search" class="search-label"></label>
<input type="text" class="form-control search-control" placeholder="Enter your search term..." name="search" id="search">
</div>
</div>
</form>
Za da postignem ovo, koristim ovaj css:
.form-control.search-control {
width: 0;
}
.search-label:focus ~ .form-control.search-control,
.form-control.search-control:focus {
width: 315px;
}
Probljem je sto ovo ne radi na iPhone, iPad i drugi tableti i mobilni. Kako mogu da napravim da na touch vrz labelu se sluci isto sto se slucuje i na click, ta labela da dobije :focus ?