Question

I’m using this for my scroll transition between a top and bottom div:

<script type="text/javascript">

$('a').on('click', function (event) {
    event.preventDefault();//stop the browser from jumping to the anchor
    var href  = $(this).attr('href'),
        oset  = $(href).offset().top;
    $('html, body').stop().animate({
        scrollTop : oset
    }, 1000, function () {
        location.hash = href;
    });
});

</script>

But it’s conflicting with how I’m using fancybox as it’s using ‘href’, I’ve tried defining the ‘div ids’ in place and creating a shared class (eg .smooth and called in both links) but it just broke. How can I use this specifing only two divs for it to apply to?

Question spawning from – https://stackoverflow.com/questions/8547378/fancybox-with-iframe-js-conflictions-with-my-site-wont-implement

Answer 1

Change this:

$('#menu a').on('click', function (event) {
    event.preventDefault();//stop the browser from jumping to the anchor
    var href  = $(this).attr('href'),
        oset  = $(href).offset().top;
    $('html, body').stop().animate({
        scrollTop : oset
    }, 1000, function () {
        location.hash = href;
    });
});

There is no point in scrolling when ‘Gallery’ is clicked and opens fancybox.