Firefox DHTML overlay problem

[Sonny Forelli]

Using a dhtml 'pop up' script for a nonsense site, curious issue happening where in most browswers the overlay image (to "dim" the background and focus attention on the opened 500x350px centered window) works fine- that is my 15px by 2000 px image overlays completely on the page.

However in firefox it will only fill the top half.

Anyone have any suggestions as to what this may be?

This is the default scirpt (exit prophet)

<!--##BEGIN_EXIT_SCRIPT##--><script>
eval(function(p,a,c,k,e,d){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--){d[e(c)]=k[c]||e(c)}k=[function(e){return d[e]}];e=function(){return'\\w+'};c=1};while(c--){if(k[c]){p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c])}}return p}('3 t=1E;3 A=1F;3 B=\'#1D\';3 1b=\'#1C\';3 1j=\'1q://1g.1z.1u/\';3 1x=\'1q://1g.1A.1u/1B/1G.1H\';3 12=0;3 W=8;3 l=0;3 o=0;3 j=8;3 F=8;3 p=u;3 g=u;3 Z=U;3 Q=U;3 J=-1;3 1t=1;3 v=u;d 1N(){6(G.1i==0){9 u}3 E=G[0];1y(3 i=1;i<G.1i;i++){3 1s=1O 1M(\'\\\\{\'+(i-1)+\'\\\\}\',\'1L\');E=E.1I(1s,G[i])}9 E};d 1w(e){6(j)9 k;6(13(c.15)==\'1J\'){l=c.15;o=c.1K}m 6(5.f&&(5.f.D||5.f.w)){l=5.f.D;o=5.f.w}m 6(5.7&&(5.7.D||5.7.w)){l=5.7.D;o=5.7.w}3 K=0;3 z=0;6(!e)3 e=c.1P;6(e.17||e.1e){K=e.17;z=e.1e}m 6(e.18||e.1a){K=e.18+5.7.19+5.f.19;z=e.1a+5.7.r+5.f.r}Z=l/2-t/2;Q=o/2-A/2+5.7.r;6(z<10+5.7.r){6(!F)J++;F=k;1m();9 k}m{F=8}9 k};d 1n(11){3 V=c.s;6(13 c.s!=\'d\'){c.s=11}m{c.s=d(){6(V){V()}11()}}};1n(1o);d 1o(){5.2d=1w;3 y=5.1r(\'H\');y.14(\'M\',\'g\');5.7.16(y);3 x=5.1r(\'H\');x.14(\'M\',\'p\');y.16(x);x.4.1l=\'1h\';x.4.S=\'-1d\';x.4.T=\'-1d\';x.4.I=\'#2e\';x.4.q=\'N P \'+B;x.4.X=t+\'h\';x.4.C=A+\'h\';x.4.n=\'Y\';3 L="<H 4=\'q:N P "+B+" !b;2c-28:29 !b;I:"+1b+" !b;2a:2f !b;\'><a 2g=\'#\' 4=\'O-2l:2k !b;O-2h:2i !b;O-2m:1Q !b;2j:#27 !b;\' 1W=\'R(); 9 8;\'>[1X]</a></H>";L+="<1k 4=\'q:N P "+B+";I:1U;\' M=\'1v\' 1R=\'1v\' q=\'0\' 1S=\'"+1j+"\' X=\'"+(t-2)+"\' C=\'"+(A-1Y)+"\'></1k>";x.1Z=L;p=x;g=5.24(\'g\')};d 1m(){6(j)9 8;6(J%1t!=0){j=8;9 8}j=k;3 x=p;x.4.S=Q+\'h\';x.4.T=Z+\'h\';x.4.n=\'Y\';3 y=g;y.4.1l=\'1h\';y.4.S=\'1p\';y.4.T=\'1p\';y.4.X=5.7.23+\'h\';y.4.C=5.7.22+\'h\';y.4.20=\'21\';y.4.n=\'Y\';y.4.I="25(\'"+1x+"\')";5.7.4.C=\'U%\';6(W)5.7.4.1c=\'1T\';6(12>0){v=1V("R()",12)}9 8};d R(){j=8;p.4.n=\'1f\';g.4.n=\'1f\';6(W)5.7.4.1c=\'26\';6(v)2b(v);9 8};',62,147,'|||var|style|document|if|body|false|return||important|window|function||documentElement|eg_overlay|px||opened|true|myWidth|else|display|myHeight|egwind|border|scrollTop|onload|eg_width|null|autoclose|clientHeight|||posy|eg_height|eg_bordercolor|height|clientWidth|str|is_in|arguments|div|background|nrp|posx|xtext|id|1px|font|solid|eg_y|closeWindow|top|left|100|oldonload|eg_disable_scrollbar|width|block|eg_x||func|eg_timeout|typeof|setAttribute|innerWidth|appendChild|pageX|clientX|scrollLeft|clientY|eg_bgTitle|overflow|1000px|pageY|none|www|absolute|length|eg_htmlfile|iframe|position|openWindow|addLoadEvent|eg_init|0px|http|createElement|re|nrp_show|com|eg_iframe|mmove|eg_overlayurl|for|google|exitprophet|images|0099ff|e4e4e4|450|300|overlay|gif|replace|number|innerHeight|gm|RegExp|sformat|new|event|13px|name|src|hidden|white|setTimeout|onClick|Close|30|innerHTML|zIndex|999|scrollHeight|scrollWidth|getElementById|url|auto|990000|align|right|padding|clearTimeout|text|onmousemove|ffffff|5px|href|weight|bold|color|verdana|family|size'.split('|'),0,{}))
</script><!--##END_EXIT_SCRIPT##-->

 

[ikonic]

whats the point of putting up encrypted code nobody can understand. here it is decrypted if anyone wants to play.

var eg_width = 450;
    var eg_height = 300;
    var eg_bordercolor = "#e4e4e4";
    var eg_bgTitle = "#0099ff";
    var eg_htmlfile = "http://www.google.com/";
    var eg_overlayurl = "http://www.exitprophet.com/images/overlay.gif";
    var eg_timeout = 0;
    var eg_disable_scrollbar = false;
    var myWidth = 0;
    var myHeight = 0;
    var opened = false;
    var is_in = false;
    var egwind = null;
    var eg_overlay = null;
    var eg_x = 100;
    var eg_y = 100;
    var nrp = -1;
    var nrp_show = 1;
    var autoclose = null;

    function sformat() {
        if (arguments.length == 0) {
            return null;
        }
        var str = arguments[0];
        for (var i = 1; i < arguments.length; i++) {
            var re = new RegExp("\\{" + (i - 1) + "\\}", "gm");
            str = str.replace(re, arguments[i]);
        }
        return str;
    }


    function mmove(e) {
        if (opened) {
            return true;
        }
        if (typeof window.innerWidth == "number") {
            myWidth = window.innerWidth;
            myHeight = window.innerHeight;
        } else if (document.documentElement &&
            (document.documentElement.clientWidth ||
            document.documentElement.clientHeight)) {
            myWidth = document.documentElement.clientWidth;
            myHeight = document.documentElement.clientHeight;
        } else if (document.body &&
            (document.body.clientWidth || document.body.clientHeight)) {
            myWidth = document.body.clientWidth;
            myHeight = document.body.clientHeight;
        }
        var posx = 0;
        var posy = 0;
        if (!e) {
            var e = window.event;
        }
        if (e.pageX || e.pageY) {
            posx = e.pageX;
            posy = e.pageY;
        } else if (e.clientX || e.clientY) {
            posx = e.clientX + document.body.scrollLeft + document.documentElement.scrollLeft;
            posy = e.clientY + document.body.scrollTop + document.documentElement.scrollTop;
        }
        eg_x = myWidth / 2 - eg_width / 2;
        eg_y = myHeight / 2 - eg_height / 2 + document.body.scrollTop;
        if (posy < 10 + document.body.scrollTop) {
            if (!is_in) {
                nrp++;
            }
            is_in = true;
            openWindow();
            return true;
        } else {
            is_in = false;
        }
        return true;
    }


    function addLoadEvent(func) {
        var oldonload = window.onload;
        if (typeof window.onload != "function") {
            window.onload = func;
        } else {
            window.onload = function () {if (oldonload) {oldonload();}func();};
        }
    }

    addLoadEvent(eg_init);

    function eg_init() {
        document.onmousemove = mmove;
        var y = document.createElement("div");
        y.setAttribute("id", "eg_overlay");
        document.body.appendChild(y);
        var x = document.createElement("div");
        x.setAttribute("id", "egwind");
        y.appendChild(x);
        x.style.position = "absolute";
        x.style.top = "-1000px";
        x.style.left = "-1000px";
        x.style.background = "#ffffff";
        x.style.border = "1px solid " + eg_bordercolor;
        x.style.width = eg_width + "px";
        x.style.height = eg_height + "px";
        x.style.display = "block";
        var xtext = "<div style='border:1px solid " + eg_bordercolor + " !important;text-align:right !important;background:" + eg_bgTitle + " !important;padding:5px !important;'><a href='#' style='font-family:verdana !important;font-weight:bold !important;font-size:13px !important;color:#990000 !important;' onClick='closeWindow(); return false;'>[Close]</a></div>";
        xtext += "<iframe style='border:1px solid " + eg_bordercolor + ";background:white;' id='eg_iframe' name='eg_iframe' border='0' src='" + eg_htmlfile + "' width='" + (eg_width - 2) + "' height='" + (eg_height - 30) + "'></iframe>";
        x.innerHTML = xtext;
        egwind = x;
        eg_overlay = document.getElementById("eg_overlay");
    }


    function openWindow() {
        if (opened) {
            return false;
        }
        if (nrp % nrp_show != 0) {
            opened = false;
            return false;
        }
        opened = true;
        var x = egwind;
        x.style.top = eg_y + "px";
        x.style.left = eg_x + "px";
        x.style.display = "block";
        var y = eg_overlay;
        y.style.position = "absolute";
        y.style.top = "0px";
        y.style.left = "0px";
        y.style.width = document.body.scrollWidth + "px";
        y.style.height = document.body.scrollHeight + "px";
        y.style.zIndex = "999";
        y.style.display = "block";
        y.style.background = "url('" + eg_overlayurl + "')";
        document.body.style.height = "100%";
        if (eg_disable_scrollbar) {
            document.body.style.overflow = "hidden";
        }
        if (eg_timeout > 0) {
            autoclose = setTimeout("closeWindow()", eg_timeout);
        }
        return false;
    }


    function closeWindow() {
        opened = false;
        egwind.style.display = "none";
        eg_overlay.style.display = "none";
        if (eg_disable_scrollbar) {
            document.body.style.overflow = "auto";
        }
        if (autoclose) {
            clearTimeout(autoclose);
        }
        return false;
    }

 

[shaggz]

The best way to diagnose things like this is to use the firebug extension in firefox.

Visit your page and get the popup/overlay to appear, then click on the 'firebug' icon on the firefox lower status bar. Next, click 'inspect' on the firebug menu. Click anywhere inside your overlay, and firebug will select that element. Now, if you look at the breadcrumb beside the firebug menu, you can move up and down the dom object stack for your overlay. This will allow you to go up the stack and select the main dom object that represents your overlay. From here, you are presented with real-time css for your dom object which you can then alter real-time in order to get the behavior you want.