СSS opacity і selectи
2 Серпень, 2010
Зовсім недавно вичитав на хабрі цікавий CSS баг / фічу. Припустимо стоїть завдання оформити select. Результат повинен виглядати як «посилання» див картинку, при кліці на якому випадає список доступних міст, ніби нічого тут такого, але як вияснилось є такий хитрозамучений спосіб зробити це за допомогою css opacity, при тому все досить таки кросбраузерно.

Якщо для select-а встановити прозорість, то він стане прозорим, но сам список залишається непрозорим, цікава і досить корисне поведінка.
Вся сіль в простоті рішення, єдине іе6 нефуричить, но то таке.
.selectWrap select{
position:absolute;
margin:-2px 0px 0px -5px;
font-family: Trebuchet MS, sans-serif;
font-size:18px;
opacity:0;
}
<div class="selectWrap"> <select> <option>Тернопіль</option> <option>...</option> </select> </div>
От така от цікава штуковина.

Коментувати