I am trying to add an auto scroll effect to my Twitter widget.
I took the code provided by Twitter, added it to the HTML page, then added some jQuery plugin code (called Caroufredsel ) to complete this operation.
I solved the problem when the code is loaded after calling the function, by changing the initiation of the function from Document.ready to:
<script>
$(window).bind("load", function() {
$(".h-feed").carouFredSel({
items: 2,
direction: "up",
scroll : {
items: 1,
easing: "elastic",
duration: 1000,
pauseOnHover: true
}
});
});
</script>
As you can see from the code above, I'm trying to find a list item with the class "h-feed", this is an automatically generated (ol) element of the Twitter widget. The problem I am facing is that when calling the function, GetElementByClass()it returns null in the HTML container, indicating that no element was found!
- ?
( , - , 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>