2

我正在尝试构建我的第一个 safari 扩展程序，但我对一些基本概念不知所措。

第一个障碍是从工具栏按钮打开一个弹出窗口，就像 Ebay Safari 扩展一样。

http://anywhere.ebay.com/browser/safari/welcome/

4

3 回答 3

3

阅读： http: //net.tutsplus.com/tutorials/other/how-to-create-a-safari-extension-from-scratch/

它描述了按下工具栏按钮时如何发生某些事情，您只需将其放在中间：

<script>  
// Set up the Listener  
safari.application.addEventListener("command", performCommand, false);  

// Function to perform when event is received  
function performCommand(event) {  
    // Make sure event comes from the button  
    if (event.command == "open-nettuts") {  


    **YOUR FUNCTION**


    }  
}  
</script>
于 2011-02-11T12:32:49.103 回答
0

据我所知，Safari 不允许我们像 Chrome 那样创建“弹出窗口”。对于我的 Safari 扩展，我使用 jQueryUI 创建弹出窗口。您还可以使用 YUI 或 Mootools。在拆开 eBay 和 Twitter 扩展时，我看到他们使用的是 iframe。我不知道他们是如何实现它的，因为 jquery 不允许您修改 iframe 的内容（如果我在这里错了，请纠正我）。

但是要回答您的问题，您的按钮将向注入的脚本发送一个事件。该脚本可以具有类似于以下的代码：

$('body').append('<div id="mypopup">');

var myPopup = $('#mypopup').dialog({
    'autoOpen' : false ,
    'draggable' : false,
    'modal' : false,
    'resizable' : false,
    'title' : 'My Popup'
});

function messageHandler(msgEvent) {
    var messageName = msgEvent.name;
    var messageData = msgEvent.message;
    if (messageName === 'buttonPushed') {
        if (myPopup.dialog('isOpen')) {
            myPopup.dialog('close');
            return;
        }

        $('#mypopup').children().empty();   // Clear out any crap should it exist
        $('#mypopup').append(someHTML);
            myPopup.dialog('open');
            return; 
        }
    }
}

这是一个非常基本的例子。我的有一个工具栏，还有很多其他的东西。另外，你必须有真正特定的 CSS 规则来保护你的弹出窗口的 CSS 不被世界上每个站点破坏。

我也考虑过使用 global.html 打开“弹出”窗口，但据我所知，它所能做的就是打开一个窗口。我没有看到任何设置大小等属性的工具。如果有，我会走那条路，因为你的弹出窗口会受到 CSS 的保护，因为它在它自己的窗口中。

于 2011-02-28T15:54:43.070 回答
0

我认为在 Safari 下它被称为弹出框，这就是你的意思？

我注意到两件事：

  1. 如果没有命令集（在工具栏项上），则单击工具栏按钮时会自动显示弹出框
  2. 如果有命令集，则用户需要单击并按住工具栏按钮，直到弹出窗口显示。
于 2011-09-23T08:41:54.317 回答