Hello,

I want to add a (graceful) tooltip/popup that will be displayed at a fixed position (e.g. center of screen) says "Install App", "Go to AppStore", "Download Torrent" etc.

Structure:
Icon, Name, Link, Description

Dislay
Icon, Name (link inside href)

Display (upon hover)
Description

I want to apply CSS tooltip only with HTMLElement.style

Script: https://openuserjs.org/scripts/sjehuda/Black_Belt

I've found a good solution at karmatics.com

Script

<script type="text/javascript">
    function toggle( targetId ){
         if (document.getElementById){
            target = document.getElementById( targetId );
                if (target.style.display == "none"){
                    target.style.display = "";
                } else {
                    target.style.display = "none";
                }
            }
        }
</script>

HTML

    <p id="install"><a href="aardvark.xpi" id="button"><span>Install Now</span></a> <a href="#" onclick="toggle('installing');return false;">Installation Notes</a></p>
    <div id="installing" style="display:none;">
        <div>
        <p><img src="/web/20050423235409im_/http://karmatics.com/aardvark/img/options.gif" alt="Extension options" class="floatl marl"/> If you get a prompt about installing software, click <em>Edit Options</em>, click <em>Allow</em>, then click <em>OK</em>. Click Install Now again and Aardvark should be installed just like any other extension.</p>
        <p>You will need to restart Firefox before using the extension. Once you have done so, you may right-click, and then select "Start Aardvark" from the menu (alternatively you can select "Start Aardvark" from the Tools menu at the top of the browser window).</p>
        <p><a href="#" onclick="toggle('installing');return false;" id="closer"> &times; close</a></p>
        </div>
    </div>