Twitter小部件与jquery ui accordon冲突

我有以下代码：

<script src="http://widgets.twimg.com/j/2/widget.js"></script>
<script>
new TWTR.Widget({
  version: 2,
  type: 'profile',
  rpp: 4,
  interval: 30000,
  width: 250,
  height: 350,
  theme: {
    shell: {
      background: '#5785BC',
      color: '#eff4fa',
    },
    tweets: {
      background: '#ffffff',
      color: '#424242',
      links: '#2480bd'
    }
  },
  features: {
    scrollbar: false,
    loop: false,
    live: false,
    behavior: 'all'
  }
}).render().setUser('Sometwitterpage').start();
</script>
</div>
<style type="text/css">
#twtr-widget-1 {float:right; border:solid 10px #e6edf5; }
</style>

它与jqueryUI手风琴在同一个页面上，由于某种原因，它使手风琴无法工作。我花了好几个小时看是什么东西弄坏了手风琴。手风琴只有在http://widgets.twimg.com/j/2/widget.js包括在内。文件被压缩了，所以我不知道从哪里开始。有其他人见过这个吗？

<script type="text/javascript">
  $.noConflict();
  jQuery(document).ready(function($) {
    // Code for accordion here.
  });
  // Code for twitter here.
</script>

它是这样工作的，但有什么办法我可以看到来源吗？你有可以分享的网址吗？然后我们可以更好地确定相关代码的位置。。。

******更新******

我在这里更新，因为这篇帖子有点乱，聊天不起作用等等。所以，为了"包含"信息。。

在你发布到jsfiddle的<head>中没有$(document).ready(function(){})，所以你可以尝试从。。。

<body onload="new TWTR.Widget({}).render().setUser('Sometwitterpage').start();">

最好编写一个可以从onload调用的函数，该函数包含对新twitter小部件的调用。
onload只有在加载完所有内容、所有图像等后才会启动，所以你的手风琴应该已经在工作了，然后你可以调用twitter小部件。据推测，用户随后会看到twitter小部件"显示"为页面中添加的元素。

关于onload="myFunc()"的信息以及与$(document).ready()相比的差异。。。onload（）和$.ready之间的区别？

看看进展如何——如果没有，我们会考虑其他事情。

******更新2******

好的，所以如果你不能访问<body>标签，试试这个：

在有手风琴的街区：

<div id="accordion">
    <h3><a href="#">First header</a></h3>
    <div>First content</div>
    <h3><a href="#">Second header</a></h3>
    <div>Second content</div>
</div>
<script type="text/javascript">
  $.noConflict();
  jQuery(document).ready(function($) {
    // Code for accordion here eg...
       $('.accordion .head').click(function() {
    $(this).next().toggle('slow');
    return false;
   }).next().hide();
  });
</script>

然后在带有twitter小部件的块中：

<script type="text/javascript">
  //your original twitter widget code
new TWTR.Widget({
  version: 2,
  type: 'profile',
  rpp: 4,
  interval: 30000,
  width: 250,
  height: 350,
  theme: {
    shell: {
      background: '#5785BC',
      color: '#eff4fa',
    },
    tweets: {
      background: '#ffffff',
      color: '#424242',
      links: '#2480bd'
    }
  },
  features: {
    scrollbar: false,
    loop: false,
    live: false,
    behavior: 'all'
  }
}).render().setUser('Sometwitterpage').start();

</script>

看看进展如何。。。

****更新3***

在你发布在jsfiddle上的<head>中，有以下内容：

<script type="text/javascript" src="http://www.somewebsite.com/scripts/jquery/jquery-ui-1.8.19.custom.min.js?m=20120904100316"></script>

<script type="text/javascript" src="http://www.somewebsite.com/scripts/jquery/jquery.prosteps.js?m=20120904100316"></script>
<script type="text/javascript" src="http://www.somewebsite.com/scripts/jquery/jquery.boxy.js?m=20120904100316"></script>
<script type="text/javascript" src="http://www.somewebsite.com/scripts/jquery/jquery.scroll-To.js?m=20120904100316"></script>
<script type="text/javascript" src="http://www.somewebsite.com/scripts/jquery/jquery.hoverIntent.js?m=20120904100316"></script>
<script type="text/javascript" src="http://www.somewebsite.com/scripts/jquery/jquery.jqzoom1.0.1.js?m=20120904100316"></script>
<script type="text/javascript" src="http://www.somewebsite.com/scripts/jquery/jquery.tools.scrollable.min.js?m=20120904100316">

你可以选择打开/关闭这些功能吗？例如，如果你不打算使用可滚动的jquery工具，请关闭它。也就是说，不要包括source.js文件。我的猜测是，问题很有可能来自冲突的变量，所以你可以尝试通过关闭/打开各种脚本来隔离它。消除盈余是一个明确的起点。

可能有点简单，甚至可能不是最佳实践，但您尝试过更改"include"顺序吗？大概您有

<script src="yourSource/jquery-ui.js"></script>

我以前也做过——先把顺序改为包括另一个，然后就开始工作了。这并不令人满意，因为这并不能真正确定问题所在，但它可能会让你重新开始。。。

相关内容

最新更新

热门标签：