Skip to content

Latest commit

 

History

History
41 lines (30 loc) · 820 Bytes

README.md

File metadata and controls

41 lines (30 loc) · 820 Bytes

Cargo Bay Float Label Form

General

  • Animates the labels of input fields on focus
  • JQuery version

Dependencies

  • jQuery

Initialise

cargobay.floatLabelForm.init();

Usage

This component handles an animation on the labels of input fields when the user starts typing in the field. The class '.js-form__field' is used as the javascript-hook, which should be placed on the input element.

<div class="form__group">
    <label class="form__label">Your First Name</label>
    <input type="text" class="form__input js-form__field" placeholder="First Name">
</div>

Available scss variables

// Colors
$labelActive: $blue;
$labelFocus: $black;

Support

  • Latest Chrome
  • Latest FireFox
  • Latest Safari
  • IE9 and up with placeholder fallback for ie9