Question

我正在尝试使用JQuery制作滚动动画，但似乎我想要滚动的元素位于＃shadow-root。

我想要滚动的元素是主容器。元素树：

html body core-scaffold#scaffold #shadow-root core-drawer-panel#drawerPanel core-header-panel#headerPanel #shadow-root div#outerContainer div#mainPanel div#mainContainer

您可以在Polymer中使用JQuery操作＃shadow-root吗？
还有另一种方法可以在Polymer中动画滚动效果吗？

JQuery的：

$("#mainContainer").animate({
                scrollTop:$( $('#'+doc_card_id).offset().top)
            },1000, function(){
                console.log($("#doc-card-list")[0].scrollHeight + ' ' + $('#'+doc_card_id).offset().top);
            })

Answer 1

我提出了一个非常好的解决方案。如果我添加火灾事件，我可以随时滚动到顶部。像

这样的东西

任何页面

Polymer({ scrollTop: function( this.fire('scroll-top'); ) });

主页（index.html）

document.addEventListener('scroll-top'){
        var scaffold = document.querySelector('core-scaffold');
        var scrollArea = scaffold.shadowRoot.querySelector('core-header-panel');
        scrollArea.scroller.scrollTop = 0;
        // or make an animate scrolltop
    }
}

使用JQuery动画滚动效果到聚合物中的元素

1 个答案: