How Do I Make A Text Box Glow Then Fade When A Link Is Clicked?

I'm trying to make a text box at the bottom of a page more obvious - how would I go about making a link which when clicked moves the browser to the bottom of the page and then make

Solution 1:

I have a crude implementation for you. It uses the abrupt anchor tag click to move you to the text box, however, you could use jQuery's animate function to make it pretty. It does have the effect with the pulse you wanted.

http://jsfiddle.net/pBg6U/

$(function() {
    $("#glow-trigger").on('click', function(e) {
        var glower = $('.glow');
        window.setInterval(function() {  
            glower.toggleClass('active');
        }, 1000);
    });
});

Solution 2:

You can use the following function to scroll to an element. Just give the id or class to the function to which you want to scroll:

functionscrollto(element) {
    $('html, body').animate({scrollTop: ($(element).offset().top)}, 'slow');
}

For the glow effect you can use JQuery highlight function.

$(element).show("highlight");