Content Marketing

Put Tips in your Text Fields with JavaScript

Real estate is a premium on a web site, so I’m trying to be a little more efficient with mine. I found this nifty little script with the Cutline WordPress theme from Tubetorial.

You can build a couple events directly in your text field HTML that will show and hide data as the field is entered and exited. Try it out on my sidebar where you can register for an email subscription to the blog.

<input type="text" name="email" value="Enter your email address" onfocus="if (this.value == 'Enter your email address') {this.value = '';}" onblur="if (this.value == '') {this.value = 'Enter your email address';}" />

With HTML5, you can also accomplish this with the placeholder element:

<input type="text" name="email" value="Enter your email address" placeholder="Enter your email address" />

Nifty!

Douglas Karr

Douglas Karr is a fractional Chief Marketing Officer specializing in SaaS and AI companies, where he helps scale marketing operations, drive demand generation, and implement AI-powered strategies. He is the founder and publisher of Martech Zone, a leading publication in marketing technology, and a trusted advisor to startups and enterprises… More »
Back to top button
Close

Adblock Detected

We rely on ads and sponsorships to keep Martech Zone free. Please consider disabling your ad blocker—or support us with an affordable, ad-free annual membership ($10 US):

Sign Up For An Annual Membership