Pinterest javascript SDK pinOne方法弹出对话框
Pinterest javascript SDK pinOne方法弹出对话框
提问于 2018-09-25 02:35:25
下午好
CONTEXT
我们正在使用Pintrest Pinterest SDK弹出一个对话框，将一些东西固定在JavaScript上。
需求
我们希望弹出对话框出现在屏幕的中央。
PROBLEM
目前它正在工作，但对话框出现在错误的位置。
代码
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
$.getScript('https://assets.pinterest.com/js/pinit.js', function () {
var pinObj = {
url: url,
media: ogImg.attr("content")
};
pinObj.description = 'description';
PinUtils.pinOne(pinObj);
问题
有没有办法让pinOne()方法弹出以屏幕为中心的对话框？
致以敬意，
马丁·乌米特
回答 1
Stack Overflow用户
回答已采纳
发布于 2018-09-25 02:54:29
所以看起来你是在从Widgets API here中引用它。
为了回答你的问题，我不认为有一种方法可以在打开对话框的地方与通信。这通常很难，因为取决于屏幕尺寸甚至分辨率，很难确定“居中”的定义。
查看pinOne的源代码
pinOne: function(a) {
if (a.href) {
var b = e.f.parse(a.href, {
url: !0,
media: !0,
description: !0
});
b.url && b.url.match(/^http/i) && b.media && b.media.match(/^http/i) ? (b.description || (e.f.log("&type=config_warning&warning_msg=no_description&href=" + encodeURIComponent(e.d.URL)), b.description = e.d.title), e.w.open(a.href, "pin" + (new Date).getTime(), e.a.pop.base.replace("%dim%", e.a.pop.small))) : (e.f.log("&type=config_error&error_msg=invalid_url&href=" + encodeURIComponent(e.d.URL)), e.f.util.pinAny())
} else a.media ? (a.url || (e.f.log("&type=config_warning&warning_msg=no_url&href=" + encodeURIComponent(e.d.URL)), a.url = e.d.URL), a.description || (e.f.log("&type=config_warning&warning_msg=no_description&href=" + encodeURIComponent(e.d.URL)), a.description = e.d.title), e.f.log("&type=button_pinit_custom"), a.href = e.v.config.pinterest + "/pin/create/button/?guid=" + e.v.guid + "&url=" + encodeURIComponent(a.url) + "&media=" + encodeURIComponent(a.media) + "&description=" + encodeURIComponent(a.description), e.w.open(a.href, "pin" + (new Date).getTime(), e.a.pop.base.replace("%dim%", e.a.pop.small))) : (e.f.log("&type=config_error&error_msg=no_media&href=" + encodeURIComponent(e.d.URL)), e.f.util.pinAny());
a.v && a.v.preventDefault ? a.v.preventDefault() : e.w.event.returnValue = !1
},为您提供的唯一真正的自定义选项包括url、media和description。似乎真的没有任何方式来沟通“中心”。
话虽如此，我认为这仅仅是他们的Widget API的一个限制。如果你正在硬编码一个特定的pinterest链接，你也许可以创建自己的链接并传入windowFeatures。我在下面尝试了一下，它“有点”起作用了(prob需要调整确定位置的逻辑。
document.getElementById('pinterest-link').addEventListener('click', function(e) {
var URL = e.target.getAttribute('data-pin-myownlink');
// assuming you want a 450x450 popup
var w = 450;
var h = 450;
// plagiarized from http://www.nigraphic.com/blog/java-script/how-open-new-window-popup-center-screen
var dualScreenLeft = window.screenLeft != undefined ? window.screenLeft : screen.availLeft;
var dualScreenTop = window.screenTop != undefined ? window.screenTop : screen.availTop;
width = window.innerWidth ? window.innerWidth : document.documentElement.clientWidth ? document.documentElement.clientWidth : screen.width;
height = window.innerHeight ? window.innerHeight : document.documentElement.clientHeight ? document.documentElement.clientHeight : screen.height;
var left = ((width / 2) - (w / 2)) + dualScreenLeft;
var top = ((height / 2) - (h / 2)) + dualScreenTop;
window.open(URL, "Pinterest Link", 'toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=no, resizable=no, copyhistory=no, width='+width+', height='+height+', top='+top+', left='+left);
});<a id="pinterest-link" href="#" data-pin-myownlink="https://www.pinterest.com/pin/create/button/?guid=Nsp1JckZPYuE-6&url=https%3A%2F%2Fwww.flickr.com%2Fphotos%2Fkentbrew%2F6851755809%2F&media=https%3A%2F%2Ffarm8.staticflickr.com%2F7027%2F6851755809_df5b2051c9_z.jpg&description=Next%20stop%3A%20Pinterest">Click here</a>
StackOverflow禁用弹出窗口，因此这里有一个jsFiddle
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/52485399
复制相关文章
相似问题