Question

This is my code :

<script src="http://widgets.twimg.com/j/2/widget.js"></script><script>new TWTR.Widget({version: 2,type: "profile",rpp: 4,interval: 30000,width: 650,height: 202,theme: {shell: {background: "#7ee1fc",color: "#2e2e2e"},tweets: {background: "#ffffff",color: "#949494",links: "#009ece"}},features: {scrollbar: true,loop: false,vlive: false,hashtags: true,timestamp: true,avatars: false,behavior: "all"}}).render().setUser("microsoft").start();</script>

which load a twitter plugins (but this, in fact, doesnt matter). Well, now, If I wrote the whole code in a “string” and I append it by jQuery :

var myText='<script src="http://widgets.twimg.com/j/2/widget.js"><\/script><script>new TWTR.Widget({version: 2,type: "profile",rpp: 4,interval: 30000,width: 650,height: 202,theme: {shell: {background: "#7ee1fc",color: "#2e2e2e"},tweets: {background: "#ffffff",color: "#949494",links: "#009ece"}},features: {scrollbar: true,loop: false,vlive: false,hashtags: true,timestamp: true,avatars: false,behavior: "all"}}).render().setUser("microsoft").start();<\/script>'

$('#twitterContent').html(myText);

seems that it can’t load it (I get an error, TWTR is not defined).

So why one version should works and the other one not? And how can I fix this trouble?

P.S. If you want test code, this is the fiddle.

Answer 1

jQuery version:

$.getScript("http://widgets.twimg.com/j/2/widget.js", function() {
new TWTR.Widget({id: 'twitterContent',version: 2,type: "profile",rpp: 4,interval: 30000,width: 650,height: 202,theme: {shell: {background: "#7ee1fc",color: "#2e2e2e"},tweets: {background: "#ffffff",color: "#949494",links: "#009ece"}},features: {scrollbar: true,loop: false,vlive: false,hashtags: true,timestamp: true,avatars: false,behavior: "all"}}).render().setUser("microsoft").start();
})​;

FIDDLE