Jquery remove () returns to the top of the page

Question

I wrote a popup with an overlay (not like regular graphic displays) where the user clicks and the overlay covers the screen, which retrieves the image for display.

The problem is that when the user clicks the close button, my function disappears due to the image and overlay, and then deletes them. When I call the .remove() function, the browser then focuses on the body tag and scrolls to the top of the page.

I tried a workaround by capturing the coordinates of offset.top and storing them in the attribute of the element that the user clicks on, and when the popup closes even after the function was called. remove() , I use the scrollTo() function to return the correct scroll position (which for some reason will overshoot and scroll the element up).

 /*creating the popup layer and picture*/ function newsPopup(obj){ /***PART ZERO - get the timestamp value of this ***/ var itemID = $(obj).attr('itemID'); var storyNumber = $(obj).attr('storyNumber'); /*adding the identifier for later*/ var offset = $(obj).offset(); var roundedOff = Math.round(offset.top); $(obj).attr('scrollMeBack', roundedOff); /*** the script then continues to create an overlay and picture popup } /*function to remove popup*/ function overlayRemove(){ //first fade out the cover and the container $("#NEWS_overlay").fadeOut(); $("#NEWS_centeringContainer").fadeOut(); //then remove it from the page completely setTimeout('$("#NEWS_overlay").remove();$("#NEWS_centeringContainer").remove();',400); /*value to scroll the element back to*/ var scrollBack = $('[SpringCMSscrollMeBack]').attr('SpringCMSscrollMeBack'); setTimeout('$(window).scrollTop('+scrollBack+')',401); /*notes the 1 millisecond delay here to mean the scroll ahppen after the item has been removed.*/ $('[scrollMeBack]').removeAttr('scrollMeBack'); } 

Why .remove() function cause a jump at the top of the page? Even when working with scrollTo it looks scrollTo , as the material disappears, but jumps to the top of the screen, and then returns to the element in question.

Answer 1

See How do I remove a location hash without causing the page to scroll? ;

Alternatively, you can return false; stop this behavior ...