Question

I’m using Google’s smooth scrolling script for a specific anchor link #tothetop and not with any # only. I’ve done this in the example.js file (that you download with the script):

Changed:

$('a[href*=#]').click(function() { ... });

To:

$('a[href*=#tothetop]').click(function() { ... });

So now it only applies the smooth scrolling to #tothetop, but how would I apply it to other different anchor links? eg: #tothetop, #tothebottom, #gotothepub, etc.?
(Don’t ask why I’m not using the ‘#’ because that’s a long story but in short – it conflicts with another script on the page)
I’ve tried:

$('a[href*=#tothetop]','a[href*=#tothebottom]').click(function() { ... });

But this doesn’t work.
I’m not too knowledgeable with Javascript and PHP but I’m sure there’s a simple way to do this?

Full code for example.js goes like:

$(function(){

$('a[href*=#tothetop]').click(function() {

if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') 
    && location.hostname == this.hostname) {

        var $target = $(this.hash);

        $target = $target.length && $target || $('[name=' + this.hash.slice(1) +']');

        if ($target.length) {

            var targetOffset = $target.offset().top;

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

            return false;

        }

    }

});

});

Answer 1

I’d use this, because obviously you name your scrolling anchors all with “toTheAnchor”:

$('body').on('click', 'a[href^=#][href*=to]', function() {});

This should select all links starting with “#” and have “to” in the word.