Simulate the dropdown alert bar & noise of "flash update required"

thegreatescape · 01-23-2012, 02:07 PM

Hi,

I want to recreate the effect of the drop-down bar that appears at the top of your browser when prompted to download an updated version of flash. Its for a proprietory plugin, but can't seem to get anywhere with it... Anyone have any ideas?

Rowsdower! · 01-23-2012, 03:01 PM

What do you have so far? Let's start with the HTML/CSS even, if you don't have any javascript written yet...

thegreatescape · 01-23-2012, 10:38 PM

Quote:

Originally Posted by Rowsdower!

What do you have so far? Let's start with the HTML/CSS even, if you don't have any javascript written yet...

Hi thanks for responding.

https://shopplugin.net/ so essentially I would like to have:

this:

Krupski · 01-23-2012, 11:13 PM

Quote:

Originally Posted by thegreatescape

Hi,

I want to recreate the effect of the drop-down bar that appears at the top of your browser when prompted to download an updated version of flash. Its for a proprietory plugin, but can't seem to get anywhere with it... Anyone have any ideas?

Here ya go....

Code:

/**
 * creates an info bar at the top of the browser
 **/
function infoBar(text) {
    var b = document.body;
    var d = document.createElement('div');
    var p = viewPortInfo();
    d.style.width = String(p.width + 'px');
    d.style.height = '16px';
    d.style.color = '#000000';
    d.style.backgroundColor = '#ffffe1';
    d.style.border = '1px solid #666666';
    d.style.position = 'absolute';
    d.style.top = '0px';
    d.style.left = '0px';
    d.style.padding = '6px';
    d.innerHTML = text;
    b.appendChild(d);
}

/***
 * get client browser window size and position
 * returns a number (no 'px' suffix).
 **/
function viewPortInfo () {
    if (document.documentElement) {
        return {
            height : Math.round(document.documentElement.clientHeight),
            width : Math.round(document.documentElement.clientWidth),
            top : Math.round(document.documentElement.scrollTop),
            left : Math.round(document.documentElement.scrollLeft)
        }
    } else {
        return false;
    }
};

thegreatescape · 01-29-2012, 08:03 PM

Quote:

Originally Posted by Krupski

Here ya go....

Code:

/**
 * creates an info bar at the top of the browser
 **/
function infoBar(text) {
    var b = document.body;
    var d = document.createElement('div');
    var p = viewPortInfo();
    d.style.width = String(p.width + 'px');
    d.style.height = '16px';
    d.style.color = '#000000';
    d.style.backgroundColor = '#ffffe1';
    d.style.border = '1px solid #666666';
    d.style.position = 'absolute';
    d.style.top = '0px';
    d.style.left = '0px';
    d.style.padding = '6px';
    d.innerHTML = text;
    b.appendChild(d);
}

/***
 * get client browser window size and position
 * returns a number (no 'px' suffix).
 **/
function viewPortInfo () {
    if (document.documentElement) {
        return {
            height : Math.round(document.documentElement.clientHeight),
            width : Math.round(document.documentElement.clientWidth),
            top : Math.round(document.documentElement.scrollTop),
            left : Math.round(document.documentElement.scrollLeft)
        }
    } else {
        return false;
    }
};

Hi sorry about the delay in responding. I tried using this within script tags, but literraly nothing happens??

Philip M · 01-30-2012, 07:46 AM

You need to call the script.

Code:

<body onload = "infoBar('Put your desired text here ')">

Suggest replace
d.style.width = String(p.width + 'px'); // returns 0
with
d.style.width = '200px'; // or however many pixels suit your message