[UPDATE] Hide label when focus on input

Here is a way to hide a label when you focus on an input. There are many ways to do that, but I’ve used a label positioned absolute over the input, and some jQuery to hide and show it. It works even if some of the fields are pre-filled.

1. The Markup

    <label for="click_here">Click here</label>
    <input type="text" id="click_here"/>

2. The CSS

.form-row { position: relative; }
.label-hide {
  position: absolute;
  left: 10px;
  top: 3px;
  font-family: Arial;
input {
  height: 15px;
  line-height: 15px;
  padding: 5px;
  border-radius: 3px;
  border: 1px solid #cecece;

3. The jQuery

$(function() {
  $('.label-over').each(function() {
    var elem = $(this);
    $('label[for="' + $(this).attr('id') + '"]').click(function() {
    if ($(this).val() != '') {
      $('label[for="' + $(this).attr('id') + '"]').hide();
  }).focus(function() {
    $('label[for="' + $(this)[0].id + '"]').hide();
  }).blur(function() {
    if($(this).val() == '') {
      $('label[for="' + $(this)[0].id + '"]').show();
    if($(this).val() != '') {
      $('label[for="' + $(this)[0].id + '"]').hide();

BigVideo.js – big background video and images


  • the plugin helps you to add full background videos to your website;
  • you can use it with a single video on repeat or to show a video playlist;
  • the videos can play silent;
  • the plugin uses the video.js api (so you will need to include the video.js file in your page);
  • it also requires jQuery, jQuery UI and jQuery imagesloaded.


Play a series of ambient background videos (without sound)

$(function() {
    var BV = new $.BigVideo();

Remember that mobile devices do not allow video autoplay. You can use Modernizr to detect for touchscreen devices, then show a large poster image fot BigVideo to use instead

var BV = new $.BigVideo();
if (Modernizr.touch) {
} else {


Ambient video demo

Series of ambient background videos demo

Mobile demo