Twitter个人资料小工具 - 加载特定的div&在页脚中包含javascript

时间:2012-05-16 14:36:07

标签: javascript jquery dom twitter

如何在页脚中加载Twitter Widget脚本并将Widget放在特定的div中?

<html>
<body>
<!-- html code for the page -->
<script>   
     /* load Twitter widget into div#twitter-widget */
</script>
</body>

对于那些不熟悉Twitter Widget的人,其代码看起来像

new TWTR.Widget({
  version: 2,
  type: 'profile',
  rpp: 4,
  interval: 30000,
  width: 250,
  height: 300,
  theme: {
    shell: {
     background: '#333333',
     color: '#ffffff'
   },
tweets: {
  background: '#000000',
  color: '#ffffff',
  links: '#4aed05'
}
  },
  features: {
scrollbar: false,
loop: false,
live: false,
behavior: 'all'
 }
}).render().setUser('twitter').start();
</script>() 

可以使用document.ready() to load Twitter widget

1)如果脚本加载在页脚中,我如何定位div #twitter-widget 2)Sometimes this breaks

2 个答案:

答案 0 :(得分:1)

如果我理解正确,那么你想在页脚加载后运行小部件并实现正确的链接。

让我们说你的页脚的id是“页脚”。做这样的事情:

$("#footer").load(function(){
  $(this).append('<a href="https://twitter.com/share" class="twitter-share-button" data-url="http://www.THE-URL-TO-YOUR-PAGE" data-text="Check out my latest video!">Tweet</a>');

$.getScript("http://platform.twitter.com/widgets.js"); //This can also be put as a script tag above the body.

twttr.widgets.load(); //If you used the getScript above, you don't need this line
});

我希望这能回答你的问题。

快乐的编码! :)

答案 1 :(得分:0)

尝试将<script>js...</script>粘贴到您希望窗口小部件呈现的元素中,它应该就这么简单。