Frage

Ich bin mit Ariel Flesler des scrollTo jQuery-Plugin. Alles ist toll, außer beim Scrollen, die Animation zieht den Cursor über einige Links, die, mit: Auslöser schweben, verursacht ein momentane in der Animation aufzuhängen. Jede Chance, jemand weiß, wie Elemente zu deaktivieren:? Schweben Funktionen während der Animation geschieht

War es hilfreich?

Lösung

Wenn Sie sagen, die Verbindungen haben „: schweben Trigger“, meinst du du eine CSS definiert haben: Hover-Regel oder dass Sie eine JavaScript-Funktion zum Schweben Ereignis haben gebunden

Wenn es CSS ist, welche Eigenschaften Sie Einstellung, die die Hänge verursacht (ich kann nicht die hängende auf meiner Maschine mit einer einfachen font-size Änderung duplizieren). Soweit ich das beurteilen kann, können Sie keine CSS verhindern. Hover

Wenn es JavaScript, können Sie nicht nur das Ereignis unbind vor scrollTo Aufruf?

Ein wenig mehr Ausarbeitung oder ein Beispiel wäre nützlich.

Edit:

Okay, in Reaktion auf Ihren Kommentar, im Grunde haben Sie die unbind und mouseenter Ereignisse mouseleave, bevor Sie scrollTo verwenden:

$(...).unbind('mouseenter mouseleave');

Demo

Besuchen Sie http://demos.flesler.com/jquery/scrollTo/# ziel Beispiele und den folgenden Code in Firebug laufen.

Sie können dann klicken Sie auf den "Test scroll" Link, um den Code zu testen. Sie sollten sehen, dass der Browser nicht hängen, wenn die Maus über den Rest der Links schwebt.

Wenn das Scrollen stoppt Sie auf einen der „go back“ Links klicken und es wird zurückblättern, außer dieser Zeit wird es die Hover-Ereignisse nicht lösen, so sollten Sie den Browser hängen.

Hinweis: Ich habe keine hängende Erfahrung überhaupt. Verwenden Sie einen langsamen Computer oder eine ältere Version von Jquery vielleicht? Lassen Sie mich wissen, ob die Demo funktioniert wie erwartet.

/*
  Inject some CSS to add a background to the elements we
  are going to hover over and increase the font-size to 
  make the hover area bigger.
*/
$('head').append('<style type="text/css"> .back { font-size:3em!important; background-image:url(http://imgs.xkcd.com/comics/useless.jpg); background-repeat:no-repeat; } </style>');

/*
  Setup the hover events -- change the backgroundPosition
  and fade the elements in and out.
*/
function hoverOn() {    
  $(this)
    .css('backgroundPosition','-95px -210px')
    .fadeTo('normal', 1);
}

function hoverOff(){
  $(this)
    .css('backgroundPosition','-260px -110px')
    .fadeTo('normal', 0.5);
}

// Set the default opacity and bind the hover events
$('.back').not('#pane-target a:first')
  .css('opacity', 0.5)
  .hover(hoverOn, hoverOff);

// Modify the first link so that we can use it to trigger the scroll.
$('#pane-target a').eq(0)
  .css('backgroundImage', 'none') // Remove the backgroundImage for clarity
  .unbind('click') // unbind the old "go back" behaviour
  .text('test scroll')
  .click(function(){ 

    // unbind the hover events so that they don't hang the browser
    $('.back').not('#pane-target a:first')
      .unbind('mouseenter mouseleave');

    $('#pane-target').scrollTo(
      'li:eq(5)',
      800,
      {onAfter:function(){
        // re-bind the hover events
        $('.back').not('#pane-target a:first').hover(hoverOn, hoverOff);
      }}
    );

    return false;
  });
Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top