Hello,
I am in fly-by mode as I am still more than busy, so I just dumb this
one out for anyone interested. Adapt it for your needs if you like it.
This effect is similar to ScrollTo, but scrolls the viewport
vertically the minimal amount necessary to bring the element into
view.
Usage: new Effect.ScrollToFullView(element, {duration: 0.6, offset: 10});
Offset is the distance in pixel to the upper/lower viewport border.
You need to define window.isIE as true/false somewhere prior or change the code.
// Nur sowenig wie möglich scrollen, bis das Element sichtbar ist.
Effect.ScrollToFullView = Class.create();
Object.extend(Object.extend(Effect.ScrollToFullView.prototype,
Effect.ScrollTo.prototype), {
setup: function() {
Position.prepare();
this.scrollStart = Position.deltaY;
var offsets = Position.cumulativeOffset(this.element);
var rand = 0;
if(this.options.offset) rand = this.options.offset;
var element_kante_oben = offsets[1];
var element_hoehe = this.element.offsetHeight;
// Länge und Position des dargestellten Ausschnitts relativ zum
gesamten Dokument
var screen_bottom, screen_height, screen_scrolled;
if (isIE){
screen_height = document.documentElement.clientHeight;
screen_scrolled = document.documentElement.scrollTop;
} else {
screen_height = window.innerHeight;
screen_scrolled = window.pageYOffset;
}
screen_bottom = screen_scrolled + screen_height;
// Obere Kante des Elements sichtbar und Position des Elements +
seine Höhe < screen_bottom
// => Element wird schon komplett dargestellt
if (element_kante_oben > screen_scrolled && element_kante_oben +
element_hoehe + rand < screen_bottom ) {
this.delta = 0;
return;
}
var new_top;
// Wenn Element höher als Bildschirmhöhe, dann bis zur oberen
Kante des Elements scrollen
if (element_hoehe + rand > screen_height) {
new_top = element_kante_oben - rand;
} else {
// Muß nach oben gescrollt werden?
if (element_kante_oben < screen_scrolled) {
// nach oben scrollen
new_top = element_kante_oben - rand;
} else {
// nach unten scrollen
new_top = element_kante_oben + element_hoehe + rand - screen_height;
}
}
var max = !isIE
? window.height - screen_height
: document.body.scrollHeight - screen_height;
this.delta = (new_top > max ? max : new_top) - this.scrollStart;
}
});