Javascript 博客上的Tumblr自定义共享按钮-打开弹出窗口

Javascript 博客上的Tumblr自定义共享按钮-打开弹出窗口,javascript,tumblr,blogger,Javascript,Tumblr,Blogger,我试图在我的帖子下创建一个从blogger到tumblr的共享按钮。使用高级选项,我几乎实现了我的目标,但代码没有打开新窗口,而是使用与共享帖子相同的选项卡,并在应该关闭选项卡的最后一秒挂起 如何更改代码以打开一个漂亮的弹出窗口 <!-- Put this tag wherever you want your button to appear --> <span id="tumblr_button_abc123"></span> <!-- Set th

我试图在我的帖子下创建一个从blogger到tumblr的共享按钮。使用高级选项,我几乎实现了我的目标,但代码没有打开新窗口,而是使用与共享帖子相同的选项卡,并在应该关闭选项卡的最后一秒挂起

如何更改代码以打开一个漂亮的弹出窗口

<!-- Put this tag wherever you want your button to appear -->
<span id="tumblr_button_abc123"></span>

<!-- Set these variables wherever convenient -->
<script type="text/javascript">
    var tumblr_link_url = "http://www.example.com/permalink/my-article";
    var tumblr_link_name = "My Awesome Article";
    var tumblr_link_description = "Lorem ipsum...";
</script>

<!-- Put this code at the bottom of your page -->
<script type="text/javascript">
    var tumblr_button = document.createElement("a");
    tumblr_button.setAttribute("href", "http://www.tumblr.com/share/link?url=" + encodeURIComponent(tumblr_link_url) + "&name=" + encodeURIComponent(tumblr_link_name) + "&description=" + encodeURIComponent(tumblr_link_description));
    tumblr_button.setAttribute("title", "Share on Tumblr");
    tumblr_button.setAttribute("style", "display:inline-block; text-indent:-9999px; overflow:hidden; width:20px; height:20px; background:url('http://platform.tumblr.com/v1/share_4.png') top left no-repeat transparent;");
    tumblr_button.innerHTML = "Share on Tumblr";
    document.getElementById("tumblr_button_abc123").appendChild(tumblr_button);
</script>

var tumblr_link_url=”http://www.example.com/permalink/my-article";
var tumblr\u link\u name=“我的精彩文章”;
var tumblr_link_description=“Lorem ipsum…”;
var tumblr_button=document.createElement(“a”);
tumblr_按钮。setAttribute(“href”http://www.tumblr.com/share/link?url=“+encodeURIComponent(tumblr_link_url)+”&name=“+encodeURIComponent(tumblr_link_name)+”&description=“+encodeURIComponent(tumblr_link_description));
setAttribute(“标题”,“tumblr上的共享”);
tumblr_按钮.setAttribute(“样式”,“显示:内联块;文本缩进:-9999px;溢出:隐藏;宽度:20px;高度:20px;背景:url('http://platform.tumblr.com/v1/share_4.png“)左上角无重复透明;”;
tumblr_button.innerHTML=“在tumblr上共享”;
document.getElementById(“tumblr\u按钮”\u abc123”).appendChild(tumblr\u按钮);

您可以更改链接目标:

tumblr_button.setAttribute("target", "_blank");
但是,如果要控制尺寸(并保证它不会在新选项卡中呈现),则需要执行以下操作:

tumblr_button.setAttribute("onclick", "window.open(this.href, 'mywin','left=20,top=20,width=500,height=500,toolbar=1,resizable=0'); return false;");
后一种解决方案是借用自,但您可能还想查看IE兼容性问题