Nonchalantly Perusing Magazines

    ion-ripple

    1.1.0 • Public • Published

    ion-ripple

    Bower version npm version devDependency Status

    A pure javascript (no polymer, no jQuery) Ionic directive that adds a Google Material Design ripple effect when clicked or touched based on angular-ripple.

    Bower

    bower install --save ion-ripple

    NPM

    npm install --save ion-ripple

    Usage

    Include the script in your HTML

    <link href="lib/ion-ripple/ion-ripple.css" rel="stylesheet">
    <script src="lib/ion-ripple/ion-ripple.min.js"></script>

    Also you can import ripple scss file into your app styles

    @import '../lib/ion-ripple/ion-ripple';

    There are some default SASS variables available that can be overriden:

    $ion-ripple-color: #fff !default;
    $ion-ripple-duration: .45s !default;
    

    Then include ionMDRipple in your module dependencies

    angular.module('app', ['ionMDRipple']);

    Then add the ion-ripple attribute to elements

    <button ion-ripple>Ripple!</button>

    Also you can specify ripple effect color with ion-ripple-color attribute.

    <button ion-ripple ion-ripple-color="#ff0000">Ripple!</button>

    Install

    npm i ion-ripple

    DownloadsWeekly Downloads

    5

    Version

    1.1.0

    License

    MIT

    Last publish

    Collaborators

    • bobrov1989