2 Replies - 671 Views - Last Post: 28 July 2012 - 05:37 PM

#1 cyberbytesdesign  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 9
  • Joined: 30-June 12

How Do You Smooth Scroll on Click With a Filter?

Posted 28 July 2012 - 05:24 PM

I am trying to make it so whenever you click one of the sorting buttons, it smooth scrolls down to #filter (so the sorting buttons are at the top of the page).

I was able to put location.href='#filter' at the end of my function here:

    $("#advfilter ul").hide();
      $('.option-set a').on('click', function() {
      $("#advfilter ul").hide();
      $("#" + $(this).attr('data-subid')).show();
      location.href='#filter'
    });



And it works how I want it to, on click of the button, it jumps down to the id #filter, but I can't seem to get it to smooth scroll down there.

If I instead make all of the buttons have a [href="#filter"] then it smooth scrolls down as I set the property to href's, but then it doesn't perform the sorting javascript.

And here is the smoothscroll function that I have which works on all href's otherwise:

    $('.navbar a, .scroll a, .smoothscroll a').bind('click',function(event){
        var $anchor = $(this);

        $('html, body').stop().animate({
            scrollTop: $($anchor.attr('href')).offset().top
        }, 850,'easeInOutExpo');
        event.preventDefault();
    });



Site: http://cyberbytesdes.../WIP2/bathroom/

Thanks!

Is This A Good Question/Topic? 0
  • +

Replies To: How Do You Smooth Scroll on Click With a Filter?

#2 Dogstopper  Icon User is offline

  • The Ninjaducky
  • member icon



Reputation: 2858
  • View blog
  • Posts: 10,962
  • Joined: 15-July 08

Re: How Do You Smooth Scroll on Click With a Filter?

Posted 28 July 2012 - 05:33 PM

I found two links on Google that explain this pretty well:
http://www.sycha.com...al-anchor-links
http://css-tricks.co...ooth-scrolling/

Let us know how they work!
Was This Post Helpful? 0
  • +
  • -

#3 cyberbytesdesign  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 9
  • Joined: 30-June 12

Re: How Do You Smooth Scroll on Click With a Filter?

Posted 28 July 2012 - 05:37 PM

View PostDogstopper, on 28 July 2012 - 05:33 PM, said:

I found two links on Google that explain this pretty well:
http://www.sycha.com...al-anchor-links
http://css-tricks.co...ooth-scrolling/

Let us know how they work!


I'm sorry, but I'm not just "smooth scrolling" an anchor on my page.. I'm having difficulties getting it to work while performing multiple JQuery functions (well isotope)..

I don't know how I can explain the issue I am having better, but I know how to smoothscroll easily using "<a href=#>" but cannot figure it out inside of a Javascript function so it also sorts. (if you look at the link I posted with it, you can see what I'm trying to do).

Thanks though,

Alex
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1