CODEWITHSUNDEEP
javascriptjqueryhtmlcssinternet-explorer
Jon Roop
Jon Roop

Reputation: 31

Scroll to the top of a DIV using JavaScript/jQuery?

I have a <div> popup that is shown when a link is clicked. It has scrollable content if there is overflow.

I just need to have the <div> at the top of the scrollable area if the link is clicked again. This is working perfectly in Chrome and Firefox, however in IE, it remains scrolled to the bottom of the popup.

<div id="myModal" data-role="popup" data-position-to="window" data-history="false" data-theme="a" data-corners="true" class="ui-content" style="text-align:center">
    <div class="modal-dialog">
         <div class="modal-content">
             <div id='myModalContent'></div>

             <a href="#" id="closeButton" class="ui-btn ui-corner-all ui-shadow ui-btn-inline ui-btn-b">OK</a>
         </div>
    </div>
</div>   

$(".anchorDetail").click(function () {
    $("#myModal").scrollTop(0);
}

Upvotes: 0

Views: 6132

Answers (2)

Jon Roop
Jon Roop

Reputation: 31

Thank you all for your suggestions.

I feel so so dumb.
I was having it attempt to scroll to the top before it populated the data and opened the popup.

I moved the .scrollTop() function to after i Open the popup, and VOILA.

Thank you all again.

Upvotes: 0

Toufic Batache
Toufic Batache

Reputation: 192

Try this, it's done with JS and not jQuery:

document.querySelector('.anchorDetail').addEventListener('click', function() {
var myDiv = document.getElementById('myModal');
myDiv.scrollTop = 0;
});

Upvotes: 3

Related Questions