Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

set Focus on Top of screen jquery

I have a page with multiple tabs and i Show and hide them based on a href click using jquery. Whenever I click on "a href", the page is scrolled down. Am trying to set the focus on the top of the page. This is my first project in Jquery. I tried the following but still doesnt work.

  1. scroll(0, 0);
  2. window.scrollTo(0,0);
  3. window.scrollTo(0, document.body.scrollHeight);
  4. var ctrl = document.getElementById('lnkCreateJob'); ctrl.focus();

please do share some light on that matter.

like image 533
Archana David Avatar asked Jan 01 '26 03:01

Archana David


2 Answers

Try like this:

$(".gototop").click(function(){
    var focusElement = $("#contents");
    $(focusElement).focus();
    ScrollToTop(focusElement);
});

function ScrollToTop(el) {
    $('html, body').animate({ scrollTop: $(el).offset().top - 50 }, 'slow');          
}

SEE DEMO

like image 154
Ahsan Khurshid Avatar answered Jan 02 '26 17:01

Ahsan Khurshid


Just use <a href="#">Your link</a>. It will take you to the top of the page.

like image 28
G . R Avatar answered Jan 02 '26 17:01

G . R



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!