Template:Team:HokkaidoU Japan/header/js
From 2013.igem.org
/*!
* hoverIntent r7 // 2013.03.11 // jQuery 1.9.1+ * http://cherne.net/brian/resources/jquery.hoverIntent.html * * You may use hoverIntent under the terms of the MIT license. Basically that * means you are free to use hoverIntent as long as this header is left intact. * Copyright 2007, 2013 Brian Cherne */
/* hoverIntent is similar to jQuery's built-in "hover" method except that
* instead of firing the handlerIn function immediately, hoverIntent checks * to see if the user's mouse has slowed down (beneath the sensitivity * threshold) before firing the event. The handlerOut function is only * called after a matching handlerIn. * * // basic usage ... just like .hover() * .hoverIntent( handlerIn, handlerOut ) * .hoverIntent( handlerInOut ) * * // basic usage ... with event delegation! * .hoverIntent( handlerIn, handlerOut, selector ) * .hoverIntent( handlerInOut, selector ) * * // using a basic configuration object * .hoverIntent( config ) * * @param handlerIn function OR configuration object * @param handlerOut function OR selector for delegation OR undefined * @param selector selector OR undefined * @author Brian Cherne <brian(at)cherne(dot)net> */
(function($) {
$.fn.hoverIntent = function(handlerIn,handlerOut,selector) {
// default configuration values var cfg = { interval: 100,
sensitivity: 7, timeout: 0
};
if ( typeof handlerIn === "object" ) { cfg = $.extend(cfg, handlerIn ); } else if ($.isFunction(handlerOut)) { cfg = $.extend(cfg, { over: handlerIn, out: handlerOut, selector: selector } ); } else { cfg = $.extend(cfg, { over: handlerIn, out: handlerIn, selector: handlerOut } ); }
// instantiate variables // cX, cY = current X and Y position of mouse, updated by mousemove event // pX, pY = previous X and Y position of mouse, set by mouseover and polling interval var cX, cY, pX, pY;
// A private function for getting mouse position var track = function(ev) { cX = ev.pageX; cY = ev.pageY; };
// A private function for comparing current and previous mouse position var compare = function(ev,ob) { ob.hoverIntent_t = clearTimeout(ob.hoverIntent_t); // compare mouse positions to see if they've crossed the threshold if ( ( Math.abs(pX-cX) + Math.abs(pY-cY) ) < cfg.sensitivity ) { $(ob).off("mousemove.hoverIntent",track); // set hoverIntent state to true (so mouseOut can be called) ob.hoverIntent_s = 1; return cfg.over.apply(ob,[ev]); } else { // set previous coordinates for next time pX = cX; pY = cY; // use self-calling timeout, guarantees intervals are spaced out properly (avoids JavaScript timer bugs) ob.hoverIntent_t = setTimeout( function(){compare(ev, ob);} , cfg.interval ); } };
// A private function for delaying the mouseOut function var delay = function(ev,ob) { ob.hoverIntent_t = clearTimeout(ob.hoverIntent_t); ob.hoverIntent_s = 0; return cfg.out.apply(ob,[ev]); };
// A private function for handling mouse 'hovering' var handleHover = function(e) { // copy objects to be passed into t (required for event object to be passed in IE) var ev = jQuery.extend({},e); var ob = this;
// cancel hoverIntent timer if it exists if (ob.hoverIntent_t) { ob.hoverIntent_t = clearTimeout(ob.hoverIntent_t); }
// if e.type == "mouseenter" if (e.type == "mouseenter") { // set "previous" X and Y position based on initial entry point pX = ev.pageX; pY = ev.pageY; // update "current" X and Y position based on mousemove $(ob).on("mousemove.hoverIntent",track); // start polling interval (self-calling timeout) to compare mouse coordinates over time if (ob.hoverIntent_s != 1) { ob.hoverIntent_t = setTimeout( function(){compare(ev,ob);} , cfg.interval );}
// else e.type == "mouseleave" } else { // unbind expensive mousemove event $(ob).off("mousemove.hoverIntent",track); // if hoverIntent state is true, then call the mouseOut function after the specified delay if (ob.hoverIntent_s == 1) { ob.hoverIntent_t = setTimeout( function(){delay(ev,ob);} , cfg.timeout );} } };
// listen for mouseenter and mouseleave return this.on({'mouseenter.hoverIntent':handleHover,'mouseleave.hoverIntent':handleHover}, cfg.selector); };
})(jQuery);
/*
* DC Mega Menu - jQuery mega menu * Copyright (c) 2011 Design Chemical * */
(function($){
//define the defaults for the plugin and how to call it $.fn.dcMegaMenu = function(options){ //set default options var defaults = { classParent: 'dc-mega',
classContainer: 'sub-container', classSubParent: 'mega-hdr', classSubLink: 'mega-hdr', classWidget: 'dc-extra', rowItems: 3, speed: 'fast', effect: 'fade', event: 'hover', fullWidth: false, onLoad : function(){}, beforeOpen : function(){}, beforeClose: function(){}
};
//call in the default otions var options = $.extend(defaults, options); var $dcMegaMenuObj = this;
//act upon the element that is passed into the design return $dcMegaMenuObj.each(function(options){
var clSubParent = defaults.classSubParent; var clSubLink = defaults.classSubLink; var clParent = defaults.classParent; var clContainer = defaults.classContainer; var clWidget = defaults.classWidget;
megaSetup();
function megaOver(){ var subNav = $('.sub',this); $(this).addClass('mega-hover'); if(defaults.effect == 'fade'){ $(subNav).fadeIn(defaults.speed); } if(defaults.effect == 'slide'){ $(subNav).show(defaults.speed); } // beforeOpen callback; defaults.beforeOpen.call(this); } function megaAction(obj){ var subNav = $('.sub',obj); $(obj).addClass('mega-hover'); if(defaults.effect == 'fade'){ $(subNav).fadeIn(defaults.speed); } if(defaults.effect == 'slide'){ $(subNav).show(defaults.speed); } // beforeOpen callback; defaults.beforeOpen.call(this); } function megaOut(){ var subNav = $('.sub',this); $(this).removeClass('mega-hover'); $(subNav).hide(); // beforeClose callback; defaults.beforeClose.call(this); } function megaActionClose(obj){ var subNav = $('.sub',obj); $(obj).removeClass('mega-hover'); $(subNav).hide(); // beforeClose callback; defaults.beforeClose.call(this); } function megaReset(){ $('li',$dcMegaMenuObj).removeClass('mega-hover'); $('.sub',$dcMegaMenuObj).hide(); }
function megaSetup(){ $arrow = ''; var clParentLi = clParent+'-li'; var menuWidth = $dcMegaMenuObj.outerWidth(); $('> li',$dcMegaMenuObj).each(function(){ //Set Width of sub var $mainSub = $('> ul',this); var $primaryLink = $('> a',this); if($mainSub.length){ $primaryLink.addClass(clParent).append($arrow); $mainSub.addClass('sub').wrap('<div class="'+clContainer+'" />');
var pos = $(this).position(); pl = pos.left;
if($('ul',$mainSub).length){ $(this).addClass(clParentLi); $('.'+clContainer,this).addClass('mega'); $('> li',$mainSub).each(function(){ if(!$(this).hasClass(clWidget)){ $(this).addClass('mega-unit'); if($('> ul',this).length){ $(this).addClass(clSubParent); $('> a',this).addClass(clSubParent+'-a'); } else { $(this).addClass(clSubLink); $('> a',this).addClass(clSubLink+'-a'); } } });
// Create Rows var hdrs = $('.mega-unit',this); rowSize = parseInt(defaults.rowItems); for(var i = 0; i < hdrs.length; i+=rowSize){ hdrs.slice(i, i+rowSize).wrapAll('<div class="row" />'); }
// Get Sub Dimensions & Set Row Height $mainSub.show();
// Get Position of Parent Item var pw = $(this).width(); var pr = pl + pw;
// Check available right margin var mr = menuWidth - pr;
// // Calc Width of Sub Menu var subw = $mainSub.outerWidth(); var totw = $mainSub.parent('.'+clContainer).outerWidth(); var cpad = totw - subw;
if(defaults.fullWidth == true){ var fw = menuWidth - cpad; $mainSub.parent('.'+clContainer).css({width: fw+'px'}); $dcMegaMenuObj.addClass('full-width'); } var iw = $('.mega-unit',$mainSub).outerWidth(true); var rowItems = $('.row:eq(0) .mega-unit',$mainSub).length; var inneriw = iw * rowItems; var totiw = inneriw + cpad;
// Set mega header height $('.row',this).each(function(){ $('.mega-unit:last',this).addClass('last'); var maxValue = undefined; $('.mega-unit > a',this).each(function(){ var val = parseInt($(this).height()); if (maxValue === undefined || maxValue < val){ maxValue = val; } }); $('.mega-unit > a',this).css('height',maxValue+'px'); $(this).css('width',inneriw+'px'); });
// Calc Required Left Margin incl additional required for right align
if(defaults.fullWidth == true){ params = {left: 0}; } else {
var ml = mr < ml ? ml + ml - mr : (totiw - pw)/2; var subLeft = pl - ml;
// If Left Position Is Negative Set To Left Margin var params = {left: pl+'px', marginLeft: -ml+'px'};
params = {left: 0}; } $('.'+clContainer,this).css(params);
// Calculate Row Height $('.row',$mainSub).each(function(){ var rh = $(this).height(); $('.mega-unit',this).css({height: rh+'px'}); $(this).parent('.row').css({height: rh+'px'}); }); $mainSub.hide();
} else { $(this).addClass('dc-nonmega-li'); $('.'+clContainer,this).addClass('non-mega').css('left',pl+'px'); } } }); // Set position of mega dropdown to bottom of main menu var menuHeight = $('> li > a',$dcMegaMenuObj).outerHeight(true); $('.'+clContainer,$dcMegaMenuObj).css({top: menuHeight+'px'}).css('z-index','1000');
if(defaults.event == 'hover'){ // HoverIntent Configuration var config = { sensitivity: 2, interval: 100, over: megaOver, timeout: 400, out: megaOut }; $('li',$dcMegaMenuObj).hoverIntent(config); }
if(defaults.event == 'click'){
$('body').mouseup(function(e){ if(!$(e.target).parents('.mega-hover').length){ megaReset(); } });
$('> li > a.'+clParent,$dcMegaMenuObj).click(function(e){ var $parentLi = $(this).parent(); if($parentLi.hasClass('mega-hover')){ megaActionClose($parentLi); } else { megaAction($parentLi); } e.preventDefault(); }); }
// onLoad callback; defaults.onLoad.call(this); } }); };
})(jQuery);
(function() {
$(function() { $('#header-menu').dcMegaMenu({ rowItems: '5', speed: 'fast', effect: 'fade' }); return $('#header-menu .dc-nonmega-li .sub-container').css('left', 0); });
}).call(this); (function() {
$(function() {$('