6

我知道这已在其他线程中被问过,但这些答案不适合我的情况。如果您从此处嵌入 twitter 关注按钮:

https://twitter.com/about/resources/buttons

<a href="https://twitter.com/share" class="twitter-share-button">Tweet</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>

JS 用 iframe 替换链接:

<iframe scrolling="no" frameborder="0" allowtransparency="true" src="http://platform.twitter.com/widgets/tweet_button.1360366574.html#_=1360791644346&amp;count=horizontal&amp;id=twitter-widget-0&amp;lang=en&amp;original_referer=http%3A%2F%2Fwww.foo.com%2Fsearch%2Fcats&amp;size=m&amp;text=Search%20Results%20for%20%22cats%22%20on%20Foo&amp;url=http%3A%2F%2Fwww.foo.com%2Fsearch%2Fcats" class="twitter-share-button twitter-count-horizontal" style="width: 109px; height: 20px;" title="Twitter Tweet Button" data-twttr-rendered="true"></iframe>

如您所见,宽度设置为内联样式。我知道我可以用类似的东西来覆盖它:

.twitter-share-button { width: 80px !important; }

例如,但我不想这样做,因为如果共享计数在特定内容页面上增加到非常大的数字怎么办。然后共享计数将被最小宽度所掩盖。

有没有办法告诉 twitter 根据内部的共享计数来调整返回 iframe 的大小,使其不大于所需的最小宽度?

我知道 Facebook 通过我相信的数据属性接受所需的宽度,data-width并且可以将其设置为 auto 以获得我在上面要求的行为类型。Twitter 是否为他们的分享按钮提供了类似的功能?

小提琴

4

2 回答 2

1

而不是width,设置一个min-width

.twitter-share-button { min-width: 80px !important; width: auto !important;}
于 2013-02-13T21:49:56.340 回答
1

这似乎是一个已知问题(请参阅此 Dev Twitter 线程),截至目前,它已经等待了近 2 年的有效解决方案。目前似乎没有让按钮宽度匹配其实际内容的干净方法。
一个人可以摆弄一些自定义的 javascript,但如果你试图操纵 IFrame,最后你又会碰到 IFrame/CORS 墙。

于 2014-08-19T09:36:10.537 回答