Question

I am using the following script to scroll to the top of a scrolling DIV when a link is clicked:

<script type="text/javascript" src="jquery.js"></script>
    <script>
    function goToByScroll(id){
            $('#disqus_thread').animate({scrollTop: $("#"+id).position().top},3000,'easeOutQuint');
    }
</script>

Here’s the html for the link:

   <div id="commenttext"><a href="javascript:void(0)" onClick="goToByScroll('top')"><img src="files/comment.png" class="imgHoverable"></a></div>

I would like the textarea that is underneath the DIV that is scrolled to to have the focus added to it after the scroll. I presume this would mean adding code something like this:

$("textarea.placeholder").focus();

But I am not sure how to include this in the above script. I tried adding it as a line at the end of the script, but it didn’t work.

Could someone help me out with this?

Thanks,

Nick

Answer 1

function goToByScroll(id){
  $('#disqus_thread')
   .animate({scrollTop: $("#"+id).position().top},
            3000,
            'easeOutQuint', 
            function() { $("textarea.placeholder").focus(); }
   );
}

The last argument when passed this way is the complete callback.

Documentation.