treehouse : what would you like to learn today?
Web Design Web Development iOS Development

[Solved] jQuery Accordion Issue !!!

  • Well I'm using multiple jQuery sliders on this same page & somehow I have managed to make it work, but now there's a problem: http://www.tradeglobus.com/index2.php

    The accordion menu in "Premium Memberships" div actually works on mouse hoverintent, when I added "jquery noConflict" then everything else started to work but the accordion menu is now working on CLICK event, not on hover.

    Here's the Code:

      <script>
       var $accui = jQuery.noConflict(true);
      $(function() {
          $accui( "#accordion" ).accordion({
              event: "click hoverintent"
          });
      });
    
      var cfg = ($.hoverintent = {
          sensitivity: 7,
          interval: 50
      });
    
      $.event.special.hoverintent = {
          setup: function() {
              $( this ).bind( "mouseover", jQuery.event.special.hoverintent.handler );
          },
          teardown: function() {
              $( this ).unbind( "mouseover", jQuery.event.special.hoverintent.handler );
          },
          handler: function( event ) {
              var that = this,
                  args = arguments,
                  target = $( event.target ),
                  cX, cY, pX, pY;
    
              function track( event ) {
                  cX = event.pageX;
                  cY = event.pageY;
              };
              pX = event.pageX;
              pY = event.pageY;
              function clear() {
                  target
                      .unbind( "mousemove", track )
                      .unbind( "mouseout", arguments.callee );
                  clearTimeout( timeout );
              }
              function handler() {
                  if ( ( Math.abs( pX - cX ) + Math.abs( pY - cY ) ) < cfg.sensitivity ) {
                      clear();
                      event.type = "hoverintent";
                      // prevent accessing the original event since the new event
                      // is fired asynchronously and the old event is no longer
                      // usable (#6028)
                      event.originalEvent = {};
                      jQuery.event.handle.apply( that, args );
                  } else {
                      pX = cX;
                      pY = cY;
                      timeout = setTimeout( handler, cfg.interval );
                  }
              }
              var timeout = setTimeout( handler, cfg.interval );
              target.mousemove( track ).mouseout( clear );
              return true;
          }
      };
      </script>
    

    Can anyone of you PLEASE highlight my mistakes in this code ?


    I just replaced "click hoverintent" to "on hover", & now its working !

  •       $accui( "#accordion" ).accordion({
              event: "click hoverintent"
    
  • @Daniel

    I didn't get it........it looks same I guess