'Jquery scrollTop/scrollLeft works but not animate

I have a set sized iframe within a larger sized HTML document, which makes it so it has a scrollbar. There is another set of iframe just like the first one and I wanted to synchronise the scrolling on both document. I can get both #document, which has the scrollbar. So I can set the scroll event. The issue is I would like to use .animate, but when I do I get the following error.

> jquery-3.6.0.min.js:2 Uncaught TypeError: Cannot read properties of undefined (reading 'display')
>     at ae (jquery-3.6.0.min.js:2:44259)
>     at Object.S.Animation.S.extend.prefilters (jquery-3.6.0.min.js:2:73843)
>     at lt (jquery-3.6.0.min.js:2:73011)
>     at HTMLDocument.a (jquery-3.6.0.min.js:2:76247)
>     at Function.dequeue (jquery-3.6.0.min.js:2:42775)
>     at HTMLDocument.<anonymous> (jquery-3.6.0.min.js:2:43330)
>     at Function.each (jquery-3.6.0.min.js:2:3639)
>     at S.fn.init.each (jquery-3.6.0.min.js:2:1778)
>     at S.fn.init.queue (jquery-3.6.0.min.js:2:43217)
>     at S.fn.init.animate (jquery-3.6.0.min.js:2:76386)

First of all I do not understand what is missing and if .animate does not work why does .scrollTop() and .scrollLeft() work?

I use the following code to .animate and .scrollTop()/.scrollLeft()

htmlContentSrc.scroll(function (event) {
                if (previewLangPairMngr.onScrollBlocker && previewDisplayMngr.containerSync) {
                    previewLangPairMngr.onScrollBlocker = false;
                    htmlContentTrg.animate({
                        scrollTop: htmlContentSrc.scrollTop(),
                        scrollLeft: htmlContentSrc.scrollLeft()
                    }, 100, function () {
                            previewLangPairMngr.onScrollBlocker = true;
                    });
                }
            });
htmlContentSrc.scroll(function (event) {
                if (previewLangPairMngr.onScrollBlocker && previewDisplayMngr.containerSync) {
                    previewLangPairMngr.onScrollBlocker = false;
                    htmlContentTrg.scrollTop(htmlContentSrc.scrollTop());
                    htmlContentTrg.scrollLeft(htmlContentSrc.scrollLeft());
                    previewLangPairMngr.onScrollBlocker = true;
                }
            });


Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source