Sha256: 5d6b3e347592df89c66a0c6f4c940403511a68ec1111746248a6fc404fe15882
Contents?: true
Size: 1.56 KB
Versions: 12
Compression:
Stored size: 1.56 KB
Contents
/*
* Greedy Navigation
*
* http://codepen.io/lukejacksonn/pen/PwmwWV
*
*/
var $nav = $('#site-nav');
var $btn = $('#site-nav button');
var $vlinks = $('#site-nav .visible-links');
var $hlinks = $('#site-nav .hidden-links');
var breaks = [];
function updateNav() {
var availableSpace = $btn.hasClass('hidden') ? $nav.width() : $nav.width() - $btn.width() - 30;
// The visible list is overflowing the nav
if($vlinks.width() > availableSpace) {
// Record the width of the list
breaks.push($vlinks.width());
// Move item to the hidden list
$vlinks.children().last().prependTo($hlinks);
// Show the dropdown btn
if($btn.hasClass('hidden')) {
$btn.removeClass('hidden');
}
// The visible list is not overflowing
} else {
// There is space for another item in the nav
if(availableSpace > breaks[breaks.length-1]) {
// Move the item to the visible list
$hlinks.children().first().appendTo($vlinks);
breaks.pop();
}
// Hide the dropdown btn if hidden list is empty
if(breaks.length < 1) {
$btn.addClass('hidden');
$hlinks.addClass('hidden');
}
}
// Keep counter updated
$btn.attr("count", breaks.length);
// Recur if the visible list is still overflowing the nav
if($vlinks.width() > availableSpace) {
updateNav();
}
}
// Window listeners
$(window).resize(function() {
updateNav();
});
$btn.on('click', function() {
$hlinks.toggleClass('hidden');
$(this).toggleClass('close');
});
updateNav();
Version data entries
12 entries across 12 versions & 1 rubygems