javascript – 在Twitter小部件中滚动元素

2019年7月21日 166次阅读

我正在尝试为我的Twitter小部件添加自动滚动效果.

我采用了Twitter提供的代码,将其添加到HTML页面,然后添加了一些Jquery插件代码(称为 Caroufredsel )来处理此操作.

通过将函数启动从Document.ready更改为：我已经解决了函数调用后加载代码的问题.

<script>    
$(window).bind("load", function() {    
$(".h-feed").carouFredSel({
        items: 2,
        direction: "up",
        scroll : {
        items: 1,
        easing: "elastic",
        duration: 1000,             
        pauseOnHover: true
        }               
    }); 
});       
</script>

正如上面的代码所示,我试图找到一个带有“h-feed”类的列表元素,这是Twitter小部件自动生成的(ol)元素.我面临的问题是,当调用GetElementByClass()函数时,它在HTMLcontainer中返回null,表示没有找到任何元素！

有人可以帮我解决这个问题吗？
我的完整代码在下面以供参考(抱歉格式错误,但第一部分是Twitter提供的小部件代码)：

<a class="twitter-timeline" href="https://twitter.com/NomadMadi" data-widget-id="384617889120010240">Tweets by @NomadMadi</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+"://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>


<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript" src="jquery.carouFredSel.js"></script>

最佳答案 即使您在Feed完成加载后调用您的函数,您也无法选择或操作.h-feed,因为此元素位于< iframe>内从其他域加载.这是由于一组称为
same origin policy的安全限制.

因此,无法自动滚动窗口小部件内的元素,因为它们绝对无法访问.

Twitter提供some customization options,包括例如隐藏滚动条和操纵小部件尺寸,但我担心不能再做任何事了.

点赞