Making jscript and jquery twitter widget scripts to work in IE
Ok, I am trying to implement a working Twitter Feed widget on a DNN website. I went and found
two different scripts, and put them into a container skin inside of a <div> tag toward the bottom of the container skin.
#1 In a nutshell, the first twitter feed script:
<dnn:ACTIONBUTTON runat="server" id="dnnACTIONBUTTON4" CommandName="ModuleSettings.Action" DisplayIcon="True" DisplayLink="false" />
<div class="c_footer2">
<h1></h1>
<div id="widget-twitter" class="content2">
<div id="widget-twitter-inner">
</div>
<script type="text/javascript" src="http://widgets.twimg.com/j/2/widget.j...>
<script>
jQuery(document).ready(function(jQuery) {
$.getScript('http://widgets.twimg.com/j/2/widget.js', function() {
otweet = new TWTR.Widget({
id: 'widget-twitter-inner',
version: 2,
type: 'profile',
rpp: 4,
interval: 6000,
width: 'auto',
height: 300,
theme: {
shell: {
background: '#3f67a3',
color: '#fafafa'
},
tweets: {
background: '#faf2fa',
color: '#061859',
links: '#219de0'
}
},
features: {
scrollbar: false,
loop: false,
live: false,
hashtags: true,
timestamp: true,
avatars: false,
behavior: 'all'
}
}).render().setUser('xxxUser').start();
})
})
</script>
<script src="/js/render/edit.js"></script>
</div>
#2 In a nutshell the second twitter feed script:
<dnn:ACTIONBUTTON runat="server" id="dnnACTIONBUTTON4" CommandName="ModuleSettings.Action" DisplayIcon="True" DisplayLink="false" />
<div class="c_footer2">
<div class="content2" id="twitterbox">
<div id="innerdiv"></div>
<script type="text/javascript" src="http://widgets.twimg.com/j/2/widget.j...>
<script type="text/javascript">
new TWTR.Widget({
id: 'innerdiv',
version: 2,
type: 'profile',
rpp: 4,
interval: 6000,
width: 'auto',
height: 300,
theme: {
shell: {
background: '#3f67a3',
color: '#fafafa'
},
tweets: {
background: '#faf2fa',
color: '#061859',
links: '#219de0'
}
},
features: {
scrollbar: false,
loop: false,
live: false,
hashtags: true,
timestamp: true,
avatars: false,
behavior: 'all'
}
}).render().setUser('xxxuser').start();
document.getElementById('innerdiv').click()
With the Script #1, sometimes the twitter feed box loads properly, but sometimes it loads in a wierd incomplete way, and page hangs with a "one item remaining" message.
The feeds are there, but the box is not completely loaded, AND the browser continues to "LOAD" for over 60 seconds or even forever.
Other times, the twitter box does load completely. It is easy to get the twotter box to complete loading by just clicking anywhere on the screen. The box is on all pages, and changes pages will now display a correct twitter box.
With Script #2, on the HOME page, the twitter box always loads completely, and there is no "one item remaining" hang. However, when we navigate to other pages, the twitter box is incompletely rendered, though again there is no "one item remaining" hang. In this case the box can always be rendered completely by doing a page refresh. But navigating between pages results in the incomplete box.
SO far, all of these tests were in IE 7 or IE 8 Browser
Questions:
1. What is going on? Is there any way in Dot Net Nuke to get the first script to reliably load the box, or the 2nd script to render the box correctly on all pages? Perhaps there is only a simple setting somewhere.
2. Is there a web source for javascript or jquery scripts that load Twitter feed boxes that also WORK with Dot Net Nuke?
Thanks,
Richard