Įvestis su išnykstančiu fono paveikslėliu CSS-gudrybės

Anonim

Tai pakartoja standartinių įterpiamų „Google“ paieškos laukų funkcionalumą. Jų fone yra vaizdas, o spustelėjus įvestį, vaizdas dingsta.

 Search 

„JavaScript“ po formos žymėjimu:

 (function() ( var id = document.getElementById('search-form'); if (id && id.txtInput) ( var name = id.txtInput; var unclicked = function() ( if (name.value == '') ( name.style.background = '#FFFFFF url(images/googbg.png.webp) left no-repeat'; ) ); var clicked = function() ( name.style.background = '#ffffff'; ); name.onfocus = clicked; name.onblur = unclicked; unclicked(); ) ))(); 

Peržiūrėti demonstracinę versiją