HTML:

<div id="scrooly" class="span7">
    <p>
        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc sit amet quam et orci dictum sagittis. In hac habitasse platea dictumst. Morbi sed dictum nibh. Nullam felis est, feugiat a ullamcorper sed, iaculis ut ligula. Aliquam erat volutpat. Nam in sapien magna, in feugiat velit. Quisque tellus est, ultricies a euismod sed, consectetur et libero. Quisque ac libero in elit suscipit semper. Cras eget metus quis turpis ultrices aliquam sed at enim. Integer ullamcorper odio consequat nunc egestas tempus. Cras eget orci elit, ac eleifend nunc. Phasellus tincidunt nibh arcu. Donec laoreet ornare nisl, sit amet rutrum sem mollis sed.
    </p>
    <img src="assets/img/photo01.jpg" />
    <p>
        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc sit amet quam et orci dictum sagittis. In hac habitasse platea dictumst. Morbi sed dictum nibh. Nullam felis est, feugiat a ullamcorper sed, iaculis ut ligula. Aliquam erat volutpat. Nam in sapien magna, in feugiat velit. Quisque tellus est, ultricies a euismod sed, consectetur et libero. Quisque ac libero in elit suscipit semper. Cras eget metus quis turpis ultrices aliquam sed at enim. Integer ullamcorper odio consequat nunc egestas tempus. Cras eget orci elit, ac eleifend nunc. Phasellus tincidunt nibh arcu. Donec laoreet ornare nisl, sit amet rutrum sem mollis sed.
    </p>
</div>

I moja konstrukcja:

http://jsfiddle.net/2fczn/

To działa dobrze, ale chcę, w górę iw dół na moim przewijaniu. Jak mogę to zrobić?

0
Slaythern Aareonna 22 listopad 2013, 17:04

2 odpowiedzi

Najlepsza odpowiedź

Możesz użyć następujących:

Utwórz 2 przyciski:

<button id='upClick'>Go Up</button>
<button id='downClick'>Go Down</button>

JQuery:

var scrolled = 0;
$("#downClick").on("click", function() {
    scrolled = scrolled + $("#scrooly").scrollHeight; //Edit <<
    $("#scrooly").animate({
        scrollTop: scrolled
    });
});


$("#upClick").on("click", function() {
    scrolled = scrolled - $("#scrooly").scrollHeight; //Edit <<

    $("#scrooly").animate({
        scrollTop: scrolled
    });
});

Zaktualizowano skrzypce: http://jsfiddle.net/2fCZn/3/

Mam nadzieję, że to pomoże!

1
Billy 22 listopad 2013, 13:57

Spróbuj ustawić dno o wartości ustawionej na 24px, jako wysokość stopki

-1
Vinay Shukla 22 listopad 2013, 13:10