stylie.pushmenu
Advanced tools
Stylie Push Menus, a CommonJS/browserify port of http://tympanus.net/codrops/?p=15313
100% width tabbed content with some example media queries for smaller screens. Inspired by Responsive full width tabs
Check out example/index.html, the example javascript for the example page is resources/js/example_src.js
$ npm install stylie.pushmenu
The tab component is a browserify javascript module.
JavaScript
var ComponentTabs = require('periodicjs.stylie.pushmenu'),
myTabs;
//initialize nav component after the dom has loaded
window.addEventListener('load',function(){
var tabelement = document.getElementById('tabs');
myTabs = new ComponentTabs(tabelement);
//expose your nav component to the window global namespace
window.myNav = myNav;
});
HTML
<html>
<head>
<title>Your Page</title>
<link rel="stylesheet" type="text/css" href="[path/to]/stylie.pushmenu.css">
<script src='[path/to/browserify/bundle].js'></script>
</head>
<body>
<div id="tabs" class="tabs">
<nav>
<ul>
<li>
tab1
</li>
<li>
tab2
</li>
<li>
tab3
</li>
</ul>
</nav>
<div class="content">
<section id="section-1">
any html
</section>
<section id="section-2">
can go in here
</section>
<section id="section-3">
this is fully responsive
</section>
</div>
<!-- /content -->
</div>
<!-- /tabs -->
</body>
</html>
##API
myNav.showTab(1); //show tab at index '1'
##Development Make sure you have grunt installed
$ npm install -g grunt-cli
Then run grunt watch
$ grunt watch
For generating documentation
$ grunt doc
$ jsdoc2md lib/**/*.js index.js install.js uninstall.js > doc/api.md
##Notes
resources/stylesheetsFAQs
Stylie Push Menus, a CommonJS/browserify port of http://tympanus.net/codrops/?p=15313
The npm package stylie.pushmenu receives a total of 8 weekly downloads. As such, stylie.pushmenu popularity was classified as not popular.
We found that stylie.pushmenu demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
Ransomware negotiators share how modern cybercriminals operate like corporations, using specialized teams, negotiation tactics, and reputation management.
Security News
PyPI confirms no security flaws were exploited in the Ultralytics supply chain attack and highlights improvements for safer package publishing.
Security News
Research
The Socket Research Team breaks down a malicious wrapper package that uses obfuscation to harvest credentials and exfiltrate sensitive data.