[jQuery] Zu beliebigem Element scrollen
Ab und an will man dem Seitenbesucher das Scrollen abnehmen...
(function($){
  $.fn.scrollTo = function(target, options, callback) {
    if (typeof options == 'function' && arguments.length == 2) { callback = options; options = target; }
    var settings = $.extend({
     scrollTarget  : target,
     offsetTop    : 50,
     duration    : 500,
     easing     : 'swing'
     }, options);
    return this.each(function(){
     var scrollPane = $(this);
     var scrollTarget = (typeof settings.scrollTarget == "number") ? settings.scrollTarget : $(settings.scrollTarget);
     var scrollY = (typeof scrollTarget == "number") ? scrollTarget : scrollTarget.offset().top + scrollPane.scrollTop() - parseInt(settings.offsetTop);
     scrollPane.animate({scrollTop : scrollY }, parseInt(settings.duration), settings.easing, function(){
     if (typeof callback == 'function') { callback.call(this); }
     });
    });
  };
})( jQuery );
  $.fn.scrollTo = function(target, options, callback) {
    if (typeof options == 'function' && arguments.length == 2) { callback = options; options = target; }
    var settings = $.extend({
     scrollTarget  : target,
     offsetTop    : 50,
     duration    : 500,
     easing     : 'swing'
     }, options);
    return this.each(function(){
     var scrollPane = $(this);
     var scrollTarget = (typeof settings.scrollTarget == "number") ? settings.scrollTarget : $(settings.scrollTarget);
     var scrollY = (typeof scrollTarget == "number") ? scrollTarget : scrollTarget.offset().top + scrollPane.scrollTop() - parseInt(settings.offsetTop);
     scrollPane.animate({scrollTop : scrollY }, parseInt(settings.duration), settings.easing, function(){
     if (typeof callback == 'function') { callback.call(this); }
     });
    });
  };
})( jQuery );
Anwendung
$('body').scrollTo('#target', {optionen}, callback);
Bildschirm zu einem bestimmten Element scrollen
$('#content').scrollTo(500, {optionen}, callback);
Ein bestimmtes scroll-bares Element (z.B. iframe) um eine bestimmte Anzahl Pixel scrollen
Optionen
offsetTopVersatz (px)
duration
Animations-Dauer (ms)
easing
jQuery-Animationseffekt (z.B. 'swing')
|
|
| Erstellt am: 30.08.2013 unter den Kategorien jQuery JavaScript . | Kommentieren |









