Some useful tricks available in HTML5

May 14, 2013

A quick tour of useful HTML5 features, including autofocus, the download attribute, the hidden attribute, toggling spellcheck, and datalist autosuggestions.

~~~

Warning: This post is from 2013 and is kept for historical reference.

Autofocus

<input autofocus="autofocus" /> will put the focus on the specified HTML element when the page loads

Downloading files

<a href="file.pdf" download="pdf-file">Download</a> will download the specified file, with the name provided.

Hide elements

<div hidden="hidden"></div> despite putting the presentation in the HTML, which is bad, this can sometimes turn out useful.

Turning off (or on) spellchecking

Operating systems configured to spell check everything a user types can sometimes get in the way - <input type="text" spellcheck="true|false"> can help.

Auto suggestion text input control

<input list="mylist" name="mylist" />
<datalist id="mylist">
  <option value="CSS"></option>
  <option value="HTML"></option>
  <option value="PHP"></option>
  <option value="Jquery"></option>
  <option value="Wordpress"></option>
</datalist>

Tagged: Web Platform · All topics

Follow @flaviocopes

Want me to talk about your product? You can sponsor this site.

~~~