You are here

function om_maximenu_jiggle in OM Maximenu 8

Same name and namespace in other branches
  1. 6 inc/om_maximenu.effects.inc \om_maximenu_jiggle()
  2. 7 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 380
OM Maximenu Effects

Code

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