Skip to content

RadiationX/Material-Hamburger-Arrow

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

13 Commits
 
 
 
 
 
 

Repository files navigation

Material-Back-Arrow

How to add

You must download rx_icon.css and rx_icon.js. Add this files to head

<link rel="stylesheet" href="rx_icon.css" type="text/css">
<script src="rx_icon.js" type="text/javascript"></script>

Add elem .rx_icon#rx_icon in your place in html

<div class="rx_icon" id="rx_icon"></div>

Add init in onload function

var drawerIcon;
window.addEventListener("load", function (e) {
    drawerIcon = new DrawerIcon(document.getElementById("rx_icon"));
});

##How to use methods ###.state() Return bool. True - not "opened" False - "opened"

drawerIcon.state(); //Return true or false

###.setOnClick(function) Set onclick listener:)

//Example toggle arrow state
drawerIcon.setOnClick(function () {
    if (drawerIcon.state())
        drawerIcon.setState(1);
    else
        drawerIcon.setState(0);
});

###.set(percent) Set rotate arrow by percent[0-100]

drawerIcon.set(50); //Arrow rotate 90deg

###.setState(state, duration) //duration in seconds state: 0 - "close" arrow to hamburger 1 - "open" arrow duration

drawerIcon.setState(0) //Close arrow
drawerIcon.setState(1, 0.5) //Open arrow with duration 0.5s

Default value 0.225, argument not important ###.lock() .unLock() Lock arrow in this state

drawerIcon.lock() //Lock
drawerIcon.unLock() //Unlock

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published