2013-06-30 14 views
7

Ich habe Kontaktformular mit reCaptcha und jQuery mCustomScrollbar Plugin verwenden.JQuery mCustomScrollbar autoScrollOnFocus

Problem: Wenn ich auf/reCaptcha Feld klicken, scrollt die Seite automatisch nach oben des div.

Siehe Demo on Jsffidle, Code on Jsfiddle

Hinweis: Wenn mscrollbar nicht auf jsfiddle arbeiten, dass Problem ist js und CSS von malihu Website aufrufen.

$(".scroller-back").mCustomScrollbar({ 
    advanced:{ 
    updateOnContentResize: true 
    }   
}); 

Verwendung autoScrollOnFocus: false

Auto-Scrolling auf Elemente, die den Fokus (z.B. scrollbar scrollt automatisch zu Textfelder zu bilden, wenn die TAB-Taste gedrückt wird) haben, Werte: wahr, falsch.

$(".scroller-back").mCustomScrollbar({ 
    advanced:{ 
    autoScrollOnFocus: false, 
    updateOnContentResize: true 
    }   
}); 

Es funktioniert für alle Felder, die nicht Autoscroll konzentrieren, , wie kann ich das beheben dieses Problem ohne autoScrollOnFocus: false zu verwenden?

Antwort

5

Gelöst

verwende ich jQuery focus() und mCustomScrollbar scrollTo

$("#recaptcha_response_field").focus(function() { 
    $(".scroller-back").mCustomScrollbar("scrollTo",this); 
}); 

Code on Jsffidle

Also, wenn der Fokus (mit Klick) recaptcha Feld Autoscroll auf Selbst. Aber es funktioniert nicht, wenn ich Tab-Taste benutze. Ich habe versucht, mit Alarm

$('#recaptcha_response_field').focus(function() { 
    alert('Handler for .focus() called.'); 
}); 

Es ist Arbeit, wenn Reiter und klicken Sie auf, Ich weiß nicht, jQuery focus() nicht mit scrollTo Selbst

Für die vorliegende Arbeit:

Ich verwende scrollTo mit Sende-Schaltfläche der Ziel-ID.

var a=Recaptcha.$("recaptcha_response_field"); 

$(a).focus(function() { 
    $(".scroller-back").mCustomScrollbar("scrollTo","#submit_button"); 
}); 

Code on Jsffidle

-1
$(".scroller-back").mCustomScrollbar("scrollTo", $("#yourdiv")); 
+1

Da dies eine wirklich alte Frage und eine Antwort wurde Jahre Zusammenhang vor mit viel mehr akzeptiert, empfehle ich Ihnen diese Antwort löschen. –