angular-floating-label
v1.0.2
Published
Floating label directive for AngularJs
Downloads
539
Maintainers
klaascuvelierReadme
angular-floating-label
Angular directive creating a "floating label" for inputs with a placeholder. Based on: https://github.com/jverdi/JVFloatLabeledTextField and https://github.com/maman/JVFloat.js
Changelog
Usage
Add the js file to your html file, optionally add the css file as well.
Add components to your angular dependencies and then just add floating-label as an attribute on your input fields.
floating-label requires a placeholder attribute, which will be used as label.
Optionally you can specify an ng-model, if you don't specify it, you are required to add the id or the name attribute.
Examples
<html>
<head>
<link rel="stylesheet" type="text/css" href="../dist/floating-label.css">
</head>
<body ng-app="demo">
<form>
<div class="control-group">
<input type="text" placeholder="Email address" floating-label ng-model="test" />
</div>
</form>
<script src="bower_components/angular/angular.js"></script>
<script src="bower_components/angular-floating-label/dist/floating-label.js"></script>
<script>
angular.module('demo', ['components']);
angular.module('demo').controller('DemoController', function () {});
</script>
</body>
</html>More examples in the example folder