JQuery scrollTop animation not working properly

Question

The following jQuery code scrolls to the first error of the form:

$('html,body').stop().delay(500).animate({scrollTop: $errors.filter(":first").offset().top -30},'slow');

However, if I replaced $('html,body')the name with a container element, such as a div class $('.myDivClass')with a fixed positioning, it does not seem to work. It simply scrolls to random places up and down with each view. If the container element is something other than html, body, it does not seem to work correctly.

I cannot understand what I am doing wrong.

The css element of the container element looks like this (so you know what I mean):

.mcModalWrap1{
position:fixed;
top:0;
left:0;
width:100%;
padding:50px;
background-image:url(images/overlay.png);
overflow:auto;
z-index:999;
display:none;
}

I tried using position () instead of offset () for relative positioning, but that didn't help.

Thank!

Update: there seems to be no solution for this.

Answer 1

, , , .

- scrollTop , , :

var position = $errors.filter(":first").position().top + $('. myDivClass').scrollTop()
$('.myDivClass').animate({ scrollTop: position })

.

Answer 2

. .

, animate().

, :

$(element).animate({scrollTop: 500});

$(element).scrollTop(0);
$(element).animate({scrollTop: 500});

, , , , .

, .

Answer 3

-, , . div. div, position, , .

$('.mcModalWrap1')
     .stop()
     .delay(500)
     .animate({scrollTop: $errors.filter(":first").position().top -30},'slow');

Answer 4

Solved the problem by dropping the idea. JQuery scrollTop does not work in a parent container other than html, body to go to a specific position. It only works for scrolling up or down. Neither position () nor offset () calculate the value correctly.

If anyone has an answer, I would love to know.

Answer 5

Please try replacing this line of code to see if it behaves the way you want:

$('#container').stop().delay(500).animate({scrollTop: $errors.filter(":first").offset().top - $('#container').offset().top + $('#container').scrollTop()},'slow');

You can replace the item $errors.filter(":first").offset().top - $('#container').offset().top $errors.filter(":first").position().top $errors.filter(":first").offset().top - $('#container').offset().topwith $errors.filter(":first").position().top, I believe.