Javascript Popups - Can anyone help me fancify them?

Thread view:

Enable EMail Alerts

Start New Thread

Thread rating:

Donius - 27 Jun 2005 23:36 GMT

Hello!

I've been headhunting for a javascript popup that i saw once, that when
it's called, pops open and grows from the center to its desired h and
w. Does anyone have any idea where i could start on this one? Haven't
found through googling or list searching.

Thanks!
-Brendan

Reply to this Message

Nigel Molesworth - 28 Jun 2005 11:08 GMT

>pops open and grows from the center

Are you trying to build the world's tackiest web site?

Signature

Nigel M

Reply to this Message

Donius - 28 Jun 2005 13:17 GMT

Ha ha ha ha ha...yes! Exactly!

No, but our client is stuck in the late nineties. She wants everything
moving, everything blinking and noise coming up through her speakers.
So instead of folding to *all* of her ridiculous whims, maybe if we do
some small things, we could make her happy, and if we do things like
this sparingly enough, then it could add to our site.

Reply to this Message

Nigel Molesworth - 28 Jun 2005 14:06 GMT

>She wants everything
>moving, everything blinking and noise coming up through her speakers.

<fx: shudder>

I'd be inclined to tell her to get someone else to do it. Are you
going to put your name on this site?

If there's one thing that makes me leave a site, it's bloody noise!

Signature

Nigel M

Reply to this Message

alu - 28 Jun 2005 18:52 GMT

> No, but our client is stuck in the late nineties. She wants everything
> moving, everything blinking and noise coming up through her speakers.
> So instead of folding to *all* of her ridiculous whims, maybe if we do
> some small things, we could make her happy, and if we do things like
> this sparingly enough, then it could add to our site.

I recall I have just such a tacky old script archived, um, somewhere -
except the window starts in the top right & grows to the bottom left to
accommodate content.
If you're serious, I'll have a look for it.
-alu

Reply to this Message

Donius - 29 Jun 2005 14:22 GMT

That'd be wonderful! Yes, i am serious. :)

Reply to this Message

alu - 29 Jun 2005 15:38 GMT

> That'd be wonderful! Yes, i am serious. :)

OK, for what it's worth, here ya go. Apologies for the long post.

option #1, goes within popup:
______________________________________________________________

var doneResize= 'false'

function popupResize() {
if (doneResize== 'false') {
doneResize = 'true'
imageWidth = (document.images[0].width + 100)
imageHeight = (document.images[0].height + 100)
var popupWidth = 320; var popupHeight = 360

while ((popupWidth < imageWidth) || (popupHeight < imageHeight)) {
self.resizeTo(popupWidth , popupHeight); self.moveTo(screen.availWidth -
popupWidth - 5,5)
if (popupWidth < imageWidth) {popupWidth = popupWidth + 10}
if (popupHeight < imageHeight) {popupHeight = popupHeight + 10}
}
}
}

______________________________________________________________

option #2
I found this in the same archive (doesn't look like mine, some IE-only
filter references in there),
might be more what you're after...... see form at the end for image
attributes.

______________________________________________________________

<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=iso-8859-1">
<title></title>
</head>
<body bgcolor="white">
<center>

<script language="JavaScript1.2" type="text/javascript">
var winheight=100
var winwidth=100
var cat=null

// pixels to resize by per step
step=3;

function catswindows(name,width,height,title)
{

if (!document.all)
{
if (!document.layers)
{
paramstp="height="+height+",width="+width+",top=10"+
",left=10,scrollbars=no,location=no"+
",directories=no,status=no,menubar=no,toolbar=no,resizable=no"
cat=window.open("","cat",paramstp);
oldstr="<html><title>"+title+"</title><body
background="+name+">"+"</b"+"ody></h"+"tml>";
cat.document.write(oldstr);
if (cat.focus){cat.focus();}
return;
}
else
{
LeftPosition=(screen.width)?(screen.width-width)/2:100;
TopPosition=(screen.height)?(screen.height-height)/2:100;
paramstp="height="+height+",width="+width+",top="+TopPosition+
",left="+LeftPosition+",scrollbars=no,location=no"+
",directories=no,status=no,menubar=no,toolbar=no,resizable=no"
cat=window.open("","cat",paramstp);
loadpos=height/2-40
string="<html><title>"+title+"</title><body bgcolor=black><div
id=loadintxt style='position:absolute;top:"+loadpos+"px'></div>"
string1='<s'+'cript>var
animColorIndex=0;colorArray=["#FFFFFF","#CCCCCC","#999999","#666666","#33333
3","#000000","#333333","#666666","#999999","#CCCCCC"];'
string2='function
textLooping(){if(animColorIndex==10)animColorIndex=0;document.loadintxt.docu
ment.open();'
string3='document.loadintxt.document.write("<center><font size=4
face=Comic Sans MS
color="+colorArray[animColorIndex]+"><b>Loading...</b></font></center>");doc
ument.loadintxt.document.close();'

string4='animColorIndex++;};animInterval=setInterval("textLooping()",200);</
s'+'cript>'
string5='<s'+'cript language="jav'+'ascript1.2">'
string6="function
init(){document.catpic.visibility='show';clearInterval(animInterval);documen
t.loadintxt.visibility='hide';};"
string7="</s"+"cript>"
string8="<div id=catpic
style='position:absolute;left:0px;top:0px;visibility:hidden'>"
string9="<img src='"+name+"' width="+width+" height="+height+" border=0
onload='init()'></div></b"+"ody></h"+"tml>";
cat.document.writeln(string);
cat.document.writeln(string1);
cat.document.writeln(string2);
cat.document.writeln(string3);
cat.document.writeln(string4);
cat.document.writeln(string5);
cat.document.writeln(string6);
cat.document.writeln(string7);
cat.document.writeln(string8);
cat.document.writeln(string9);
if(cat.focus){cat.focus();}
return;
}
}
LeftPosition=(screen.width)?(screen.width-width)/2:100;
TopPosition=(screen.height)?(screen.height-height)/2:100;
paramstp="height="+winheight+",width="+winwidth+",top="+TopPosition+
",left="+LeftPosition+",scrollbars=no,location=no"+
",directories=no,status=no,menubar=no,toolbar=no,resizable=no"
cat=window.open("","cat",paramstp);
string="<html><title>"+title+"</title><body topmargin=0 leftmargin=0
bgcolor=black>"
string1="<div id=loadintxt
style='position:absolute;width:100%;top:45%;text-align:center;visibility:vis
ible;font-family:Comic Sans
MS;font-size:16px;font-weight:bold'>Loading...</div>"
string2="<div id=errtxt
style='position:absolute;width:100%;top:45%;text-align:center;visibility:vis
ible;font-family:Comic Sans
MS;font-size:16px;color:red;font-weight:bold;visibility:hidden'>ERROR!!!
Please try again</div>"
string3='<s'+'cript>'+'var animColorIndex=0;'+

'colorArray=["#FFFFFF","#CCCCCC","#999999","#666666","#333333","#000000","#3
33333","#666666","#999999","#CCCCCC"];'+
'function textLooping(){if(animColorIndex==10)animColorIndex=0;'+
'loadintxt.style.color=colorArray[animColorIndex];'+
'animColorIndex++;}animInterval=setInterval("textLooping()",200);'
string4='function erroccur(){clearInterval(animInterval);'+
"loadintxt.style.visibility='hidden';"+
"errtxt.style.visibility='visible';}"+'</s'+'cript>'
string5='<s'+'cript language="jav'+'ascript1.2">'+
'function init(){clearInterval(animInterval);'+
"loadintxt.style.visibility='hidden';"+
'fltr.filters.item(0).Apply();fltr.filters.item(0).Play();'+
'fltr.style.visibility="visible";}'+'</s'+'cript>';
string6='<img id="fltr"
style="filter:BlendTrans(Duration=5);visibility:hidden" src="'+name+'"
border=0'+
' width='+width+' height='+height+' onload="init()"
onerror="erroccur()">'+
'</b'+'ody></h'+'tml>';
cat.document.writeln(string);
cat.document.writeln(string1);
cat.document.writeln(string2);
cat.document.writeln(string3);
cat.document.writeln(string4);
cat.document.writeln(string5);
cat.document.writeln(string6);

x = y = step
while (x | y)
{
cat.resizeBy (x, y)
if (cat.document.body.clientWidth >= width) x = 0
if (cat.document.body.clientHeight >= height) y = 0
}
if(cat.focus){cat.focus();}
}

function CloseCatWin()
{if(cat!=null && cat.open)cat.close()}

window.onfocus=CloseCatWin;
</script>

<p>
<center>
<form>
<input type="button" tabindex="2" value="View Image"
onclick="catswindows('image.jpg','400','450','title goes here'); return
false" onfocus="this.blur()">
</form>
</center>
</center>
</body>
</html>

Reply to this Message

Donius - 01 Jul 2005 00:21 GMT

Well, thanks to both of you! Those are fabulous for that, i was
looking for something simpler which i gave up and wrote on my own,
eventually. This is what i was more looking for...i can't get it to
open up in quite the right spot yet, for IE, FF, & Saf, but i'll work
on it.

Thanks so much! Sorry i didn't explain myself well enough!

function popWinGrow(new_height,new_width) {
    width = 100;
    height= 100;

    popWin= window.open('popup.html','test',
        'width='+width+
        ',height='+height+
        ',left='+((screen.width/2)-(width/2))+
        ',top='+((screen.height/2)-(height/2)));
    while(new_width > width || new_height > height){
        if(new_width > width){
            width = width+(width/7); }
        if(new_height > height){
            height = height+(height/7); }

        popWin.resizeTo(width, height);
        popWin.moveTo((screen.width/2)-(width/2),
                        (screen.height/2)-(height/2));
    }
}

Reply to this Message

ASM - 30 Jun 2005 02:07 GMT

> Ha ha ha ha ha...yes! Exactly!
>
> No, but our client is stuck in the late nineties. She wants everything
> moving, everything blinking and noise coming up through her speakers.

give hers url we can try to do not come

> So instead of folding to *all* of her ridiculous whims, maybe if we do
> some small things, we could make her happy, and if we do things like
> this sparingly enough, then it could add to our site.

http://perso.wanadoo.fr/stephane.moriaux/truc/pop_zoom.shtml
it is in french
clic one of 3 1st yellow links (choice of an image)
then
clic one of 2 in 2nd line of yellow links (center or left-top origines)

Signature

Stephane Moriaux et son [moins] vieux Mac

Reply to this Message

Webmaster Forum / HTML, CSS, Scripts / JavaScript / June 2005

Javascript Popups - Can anyone help me fancify them?