float-placeholder

Floating label input.

Checkout the DEMO

Install it:

npm install --save float-placeholder

Usage:

require('jquery');
require('float-placeholder');

$('[name="email"]').floatPlaceholder();

<div class="form-group--float-label">
  <input type="email" name="email" value="" placeholder="E-mail" data-float-placeholder="true">
  <label class="float-label float-label--active" for="email">E-mail</label>
</div>

@import '~float-placeholder/src/scss/float-placeholder';

Compiled version:

<script src="./node_modules/float-placeholder/js/float-placeholder.min.js"></script>
<link rel="stylesheet" href="./node_modules/float-placeholder/build/css/float-placeholder.min.css">

Building and running:

  gulp

License:

MIT