Skip to content

Instantly share code, notes, and snippets.

@rivaadara111
Created February 5, 2018 19:43
Show Gist options
  • Save rivaadara111/91168f9c8a3f5c25aca0c3a14e12832e to your computer and use it in GitHub Desktop.
Save rivaadara111/91168f9c8a3f5c25aca0c3a14e12832e to your computer and use it in GitHub Desktop.
(function($, window, document) {
function toggleMenus() {
$('.reveal_js--trigger[data-target="drop1"][data-action="toggle"]').on('click', function(e) {
var clicked_obj = $(this),
target = clicked_obj.data('target'),
target_obj = $('.reveal_js--content[data-content="' + target + '"]'),
header_obj = $('#header'),
body_element = $('body'),
window_element = $(window),
window_top = window_element.scrollTop(),
body_top = parseInt(body_element.css('top'), 10),
pos = body_top * -1;
e.preventDefault();
if (header_obj.hasClass('stuck')) {
header_obj.addClass('active');
target_obj.addClass('stuck');
}
else if (!header_obj.hasClass('stuck')) {
target_obj.removeClass('stuck');
}
// Close all open menus & reset icons
$('.reveal_js--content:not([data-content="' + target + '"])').addClass('closed');
$('.reveal_js--content[data-content="see_more"]').removeClass('drop_transition3');
$('.reveal_js--trigger:not([data-target="' + target + '"]).icon--close').removeClass('icon--close');
//open the menu
if (target_obj.hasClass('closed')){
clicked_obj.addClass('icon--close');
target_obj.removeClass('closed');
if(header_obj.hasClass('stuck')){
target_obj.css('top', header_obj.height() - 58);
}
else if (!window_element.scrollTop()){
target_obj.css('top', ($('#banner').height() - $(window).scrollTop()) + ($('#header--primary').height() - 17)); // This is only done to handle when an ad is displayed. The position of the search menu when the menu is stuck, is all done in CSS.
}
else {
target_obj.css('top', header_obj.offset().top + $('#header--primary').height() - 20);
}
if (!body_element.hasClass('menu--open')) {
body_element.addClass('menu--open');
body_element.css('top', -window_top);
}
//close the menu;
} else {
target_obj.addClass('closed');
clicked_obj.removeClass('icon--close');
if (body_element.hasClass('menu--open')) {
body_element.removeClass('menu--open');
window_element.scrollTop(pos);
body_element.css('top', 'auto');
}
}
});
// Guides Menu
$('.reveal_js--trigger[data-target="drop2"][data-action="toggle"]').on('click', function(e) {
var clicked_obj = $(this),
target = clicked_obj.data('target'),
target_obj = $('.reveal_js--content[data-content="' + target + '"]'),
guides_icon = $('.guides span'),
header_obj = $('#header'),
body_element = $('body'),
window_element = $(window),
window_top = window_element.scrollTop(),
body_top = parseInt(body_element.css('top'), 10),
pos = body_top * -1;
e.preventDefault();
if (header_obj.hasClass('stuck')) {
header_obj.addClass('active');
target_obj.addClass('stuck');
}
else if (!header_obj.hasClass('stuck')) {
target_obj.removeClass('stuck');
}
// Close all open menus & revert icons to arrow & remove top value
$('.reveal_js--content:not([data-content="' + target + '"])').addClass('closed');
$('.reveal_js--content[data-target="see_more"]').removeClass('drop_transition3');
$('.reveal_js--trigger:not([data-target="' + target + '"]).icon--close').removeClass('icon--close');
//open menu
if (target_obj.hasClass('closed')){
clicked_obj.addClass('icon--close');
target_obj.removeClass('closed');
if(header_obj.hasClass('stuck')){
target_obj.css('top', header_obj.height() - 58);
}
else if (!window_element.scrollTop()){
target_obj.css('top', ($('#banner').height() - $(window).scrollTop()) + ($('#header--primary').height() - 17)); // This is only done to handle when an ad is displayed. The position of the search menu when the menu is stuck, is all done in CSS.
}
else {
target_obj.css('top', header_obj.offset().top + $('#header--primary').height() - 20);
}
if (!body_element.hasClass('menu--open')) {
body_element.addClass('menu--open');
body_element.css('top', -window_top);
}
//close the menu;
} else {
target_obj.addClass('closed');
clicked_obj.removeClass('icon--close');
if (body_element.hasClass('menu--open')) {
body_element.removeClass('menu--open');
window_element.scrollTop(pos);
body_element.css('top', 'auto');
}
}
});
// Secondary Menu, More
$('.reveal_js--trigger[data-target="see_more"][data-action="toggle"]').on('click', function(e) {
var clicked_obj = $(this),
target = $(this).data('target'),
target_obj = $('.reveal_js--content[data-content="' + target + '"]'),
body_element = $('body'),
window_element = $(window),
window_top = window_element.scrollTop(),
more_icon = $('.open-more span');
e.preventDefault();
// Close all open menus & revert icons to arrow & remove top CSS so it can be applied to this div
$('.reveal_js--content:not([data-content="' + target + '"])').addClass('closed');
$('.reveal_js--trigger:not([data-target="' + target + '"])').removeClass('icon--close');
//open the menu
if (!target_obj.hasClass('drop_transition3')) {
target_obj.removeClass('closed').addClass('drop_transition3');
clicked_obj.addClass('icon--close');
if (body_element.hasClass('menu--open')) {
body_element.removeClass('menu--open').css('top', -window_top);
}
//close the menu
} else {
target_obj.removeClass('drop_transition3').addClass('closed');
clicked_obj.removeClass('icon--close');
}
});
}
toggleMenus();
})(jQuery, this, this.document);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment