CODEWITHSUNDEEP
javascriptjqueryhtmlcss
coder
coder

Reputation: 21

how to scroll top and bottom

$(document).ready(function() {
  $("#Wrapper").click(function () {
var th = $(this);
if (!th.hasClass('down')) {
    console.log("ret");
    th.addClass('down').stop(true).animate({
        "top": "50px"
    }, 1000, function() {
        $('body').scrollTop(th.height());
    });
} else {
    console.log("sdffsdsff");
    th.removeClass('down').stop(true).animate({
        "top": "-400px"
    }, 1000, function() {
        $('body').scrollTop(th.scrollTop());
    });
}

}); });

I have this jquery code for scroll from top to bottom and bottom to top when click on wrapper. this code works but i want this should scroll slowly from top top bottom and bottom to top when click on "wrapper" div

this is my original fiddle

http://jsfiddle.net/HtTXB/17/

how to do that? Thank you

Upvotes: 2

Views: 763

Answers (1)

Rick Hitchcock
Rick Hitchcock

Reputation: 35670

Try this:

$("#Wrapper").click(function () {
  var h= $(this).height(),
      top= $(window).scrollTop(),
      pos= top > h/2 ? 0 : h;

  $('html, body').stop().animate({
    scrollTop: pos
  },1000);
});

scrollTop is set to 0 when the window is scrolled more than half-way, and it's set to the height of Wrapper when scrolled less than half-way.

Working Fiddle

Upvotes: 1

Related Questions