watermark in textfield

Op de site www.market-locator.com heb ik een zoek-functie toegevoegd in de header.
Graag had ik een watermark met de tekst 'gemeente' gewenst in het tekstveld zoals op drupal.be.

Via javascript is zoiets mogelijk, maar is dit ook mogelijk via css? Dit daar ik niet direkt weet waar de javascript dient geplaatst te worden :-s.

Wie kan me verder helpen?

Auteur: 
tuxy
afbeelding van thekurt
Door thekurt op 24 juni, 2012 - 23:06

HTML5: Input field: attribute 'placeholder'

Volgens mij is dit wat je zoekt en hier de link:
http://www.w3schools.com/html5/att_input_placeholder.asp

Veel succes,
Kurt

Door tuxy op 25 juni, 2012 - 10:49

Kurt,

Ah das al goed dat dit nu in HTML5 zit, dus geen javascript meer ;-)
maar is dit ook mogelijk via CSS? Probleem is dat ik niet zo goed weet waar en welke HTML 'veilig' is aan te passen?
Heb ooit eens iets gelezen dat je één en ander kan aanpassen in file template.php, zonder dat je dan aan de originele *.tpl bestanden raakt. Maar kan ik daar ook dan het 'placeholder' attribuut aanpassen? Is daar ergens een goede tutorial voor te vinden?

Christophe

- founder of market-locator.com -
Twitter: @ctuxboy, @marketlocator

http://www.market-locator.com

Enkele Drupal tutorials op mijn blog:
http://ctuxboy.blogspot.be/

Door danon op 27 juni, 2012 - 02:21

Als je dit met css wil doen zou je met een background kunnen werken en gebruik maken van de :focus selector voor als het input veld geselecteerd is.

Niet geselecteerd - input background met tekst
Geselecteerd - input:focus zonder background of background zonder tekst.

Maak er dan gelijk een sprite image van mocht je met 2 backgrounds willen werken.

In je template.php kun je de output van het zoekveld inderdaad wijzigen, dat is ook een optie.
Andere optie zou misschien zijn om gebruik te maken van compact forms even voor je gecheckt en die is ook voor D7 bruikbaar.

Door tuxy op 27 juni, 2012 - 09:25

Danon,

bedankt voor je hulp en snelle reactie.

heb de module bekeken, zal ik zeker kunnen gebruiken in de toekomst.

denkt toch te gaan voor de template.php, want vroeg of laat wil ik hier toch mee leren werken. moet gewoon nog uitzoeken hoe ik snel en efficient de functies die ik wil overriden moet zoeken en toevoegen.

- founder of market-locator.com -
Twitter: @ctuxboy, @marketlocator

http://www.market-locator.com

Enkele Drupal tutorials op mijn blog:
http://ctuxboy.blogspot.be/

Bookmark and Share

Drupal is een geregistreerd merk van Dries Buytaert. | Powered by Pantheon.

Drupal.be/Drupal.nl is de website van de Nederlandstalige Drupalgemeenschap.

onomatopee