0.0.0 • Published 6 years ago

mgn-tip v0.0.0

Weekly downloads
-
License
MIT
Repository
-
Last release
6 years ago

mgn-tip ( Don't Need jQuery )

Implement tooltips function.

  • Target browser : IE9+

Install

npm i mgn-tip -S

Or Download raw data

↓ download "mgn-tip.js"


Import

import mgnTip from "mgn-tip"

Prepare an HTML with tooltips display orientation in data attribute.

<a class="j-tip_btn" data-direction="[top, right, bottom, left]">top</a>

Constructor

new mgnTip(element [, option]);
ArgumentData typeDefaultDescroption
elementString-(Required)Specify target elementex) ".j-tip"
optionObject-ex)option = {event: "click",fadeSpeed: 100,btnElm: ".btn",detailElm: ".detail"}
OptionData typeDefaultDescroption
eventString"hover"Specify event to open or close ("hover" or "click").
fadeSpeedNumber0Adjust open and close speed.
btnElmString".j-tip_btn"Specify element to become button.
detailElmString".j-tip_detail"Specify element to be content.

Method

MethodArgumentDescroption
ShowEnd = function(){};-To be executed after tooltips are displayed.

Demo

https://frontend-isobar-jp.github.io/mgn-tip/

import mgnTip from 'mgn-tip';

let tip = new mgnTip(
    ".j-tip",
    {
        fadeSpeed: 100
    }
);

tip.ShowEnd = function(){
    console.log("ShowEnd");
};