You are here

function om_maximenu_jiggle in OM Maximenu 7

Same name and namespace in other branches
  1. 8 inc/om_maximenu.effects.inc \om_maximenu_jiggle()
  2. 6 inc/om_maximenu.effects.inc \om_maximenu_jiggle()

Animated link giggle

1 call to om_maximenu_jiggle()
om_maximenu_asset_loader in inc/om_maximenu.render.inc
Loads styles and js

File

inc/om_maximenu.effects.inc, line 391
OM Maximenu Effects

Code

function om_maximenu_jiggle($menu = NULL) {
  $link_giggle_js = "\n    jQuery(document).ready(function(\$){ \n      // creates the target paths\n      var list_elements = '#om-menu-" . $menu . "' + ' li.om-leaf';\n      var link_elements = list_elements + ' .om-link';\n      var pad_out = 25;\n      var pad_in = 15;\n      var time = 150;\n      var multiplier = .8;\n      \n      // initiates the timer used for the sliding animation\n      var timer = 0;\n  \n      // creates the jiggle animation for all list elements \n      \$(list_elements).each(function(i){\n        // margin left = - ([width of element] + [total vertical padding of element])\n        \$(this).css('margin-left','-180px');\n        // updates timer\n        timer = (timer*multiplier + time);\n        \$(this).animate({ marginLeft: '0' }, timer);\n        \$(this).animate({ marginLeft: '15px' }, timer);\n        \$(this).animate({ marginLeft: '0' }, timer);\n      });\n\n      // creates the hover-jiggle effect for all link elements     \n      \$(link_elements).each(function(i){\n        \$(this).hover(\n          function(){\n            \$(this).animate({ paddingLeft: pad_out }, 150);\n          },    \n          function(){\n            \$(this).animate({ paddingLeft: pad_in }, 150);\n        });\n      });\n    });";
  drupal_add_js($link_giggle_js, "inline");
}