Search code examples
javascriptfirefoxfirefox-addonfirefox-addon-sdk

How to make a Firefox Extension URL Button show a string when hovered over


I have made my full FF extension, and there is a button in the URL bar. The boss now wants the button to show a certain string when you hover over it. Here is my current code for the button:

var loadURLButton = function(doc, urlBtnClick) {
    var urlBarIcons = doc.getElementById('urlbar-icons')
    var btn = doc.createElement('toolbarbutton');
    btn.setAttribute('id', 'urlbutton');
    btn.setAttribute('image', require('sdk/self').data.url("canNone.png"));
    btn.addEventListener('command', urlBtnClick, false);
    urlBarIcons.appendChild(btn);
    return btn;
}

var doc = require('sdk/window/utils').getMostRecentBrowserWindow().document;

var urlbarButton = loadURLButton(doc, openTab);

What can I add to this in order to make some id pop up on hover?


Solution

  • Awwwww man all that work for nothing. The attribute is not tooltip but it is tooltiptext! So just do btn.setAttribute('tooltiptext', 'what ever you want');

    var loadURLButton = function(doc, urlBtnClick) {
        var urlBarIcons = doc.getElementById('urlbar-icons')
        var btn = doc.createElement('toolbarbutton');
        btn.setAttribute('id', 'urlbutton');
        btn.setAttribute('tooltiptext', 'mytt');
        btn.setAttribute('image', 'chrome://branding/content/icon32.png');
        btn.addEventListener('command', urlBtnClick, false);
        urlBarIcons.appendChild(btn);
        return btn;
    }
    
    var doc = document;
    
    var urlbarButton = loadURLButton(doc, null);