PDA

View Full Version : prompt box needs to change color

mark
07-26-2002, 10:46 PM
can you please help me to change the grey prompt boxes to blue! will using this code help me? it doesn't seem to!

<SCRIPT LANGUAGE="JavaScript">
//Visit Good Designs for more great scripts
//http://www27.brinkster.com/gooddesigns
<!-- Begin
// Ask the user for a color preference
var displayColor = prompt("What background color do you want?", "yellow")
// The default text color is black
var textColor = "black"
// If the user chooses a black background, change the text to white
// so it is visible
if (displayColor == "black" || displayColor == "#000000" || displayColor == null) {
textColor = "white"
}
// Display page content
document.writeln("<BODY BGCOLOR=" + displayColor + " TEXT=" + textColor + ">You chose " + displayColor + "</BODY>")
// End -->
</script>
e
Roy Sinclair
07-26-2002, 11:21 PM
You can't change anything about the prompt box except the texts you feed it.
x_goose_x
07-28-2002, 06:11 AM
True, but why not make your own:


<html>

<head>

<script>

function name() {
n = promptv2("My Prompt Window","highlight","white","Question 1:","What is your name?","black","menu","John Smith","popfunc");
}

function popfunc(who) {
alert("Hello "+who+". Welcome to my site.");
}

/*
t = Window title;
tc = title color;
tfc = title font color;
q = question name;
q2 = question;
qfc = question font color
bg = background color;
v = default value;
x = what to be run afterwards;
*/

function promptv2(t,tc,tfc,q,q2,qfc,bg,v,x) {
func = x+"('";
func2 = "')";
document.getElementById('promptdiv').style.display = '';
document.getElementById('promptdiv').style.top = (document.body.clientHeight/2) - 63;
document.getElementById('promptdiv').style.left = (document.body.clientWidth/2) - 244;
document.getElementById('tbldiv').style.backgroundColor = bg;
document.getElementById('titlediv').style.backgroundColor = tc;
document.getElementById('titlediv2').style.backgroundColor = tc;
document.getElementById('promptdiv').style.borderColor = bg;
document.getElementById('titlediv').style.borderColor = bg;
document.getElementById('titlediv2').style.borderColor = bg;
document.getElementById('titlediv').style.color = tfc;
document.getElementById('titlediv').innerHTML = '&nbsp;&nbsp;'+t;
document.getElementById('quesdiv').style.color = qfc;
document.getElementById('quesdiv').innerHTML = '&nbsp;&nbsp;'+q+'<br><br>&nbsp;&nbsp;'+q2;
document.pform.val.value = v;
document.pform.ok.style.backgroundColor = bg;
document.pform.ok.style.borderColor = bg;
document.pform.cls.style.backgroundColor = bg;
document.pform.cls.style.borderColor = bg;
document.pform.cls2.style.backgroundColor = bg;
document.pform.cls2.style.borderColor = bg;
}

prompthtml = "";
prompthtml += '<div style="position: absolute; top: 0; left: 0; width: 488; height: 126; display: none; border-style: groove; border-width: 2;" id="promptdiv">';
prompthtml += '<form name="pform" onSubmit="document.getElementById(\'promptdiv\').style.display=\'none\'; eval(func+document.pform.val.value+func2); return false;">';
prompthtml += '<table id="tbldiv" border="0" width="484" height="100%" cellspacing="0" cellpadding="0" bgcolor="menu">';
prompthtml += '<tr>';
prompthtml += '<td id="titlediv" width="50%" bgcolor="#0A246A" height="22" style="border-width: 1; border-left-style: solid; border-color: #D4D0C8; border-top-style: solid; border-bottom-style: solid; color: white;">';
prompthtml += '</td>';
prompthtml += '<td id="titlediv2" width="50%" bgcolor="#0A246A" height="22" style="border-width: 1; border-right-style: solid; border-color: #D4D0C8; border-top-style: solid; border-bottom-style: solid;" valign="middle" align="right">';
prompthtml += '<input name="cls" type="button" style="position: relative; top: -2; width: 16; height: 14;" onclick="document.getElementById(\'promptdiv\').style.display=\'none\';">&nbsp;';
prompthtml += '</td>';
prompthtml += '</tr>';
prompthtml += '<tr>';
prompthtml += '<td width="100%" rowspan="2" id="quesdiv"></td>';
prompthtml += '<td valign="bottom"><input name="ok" type="Submit" value="OK" style="width: 75; height: 23;">&nbsp;&nbsp;&nbsp;</td>';
prompthtml += '</tr>';
prompthtml += '<tr>';
prompthtml += '<td><input name="cls2" type="button" value="Cancel" style="width: 75; height: 23;" onclick="document.getElementById(\'promptdiv\').style.display=\'none\';">&nbsp;&nbsp;&nbsp;</td>';
prompthtml += '</tr>';
prompthtml += '<tr>';
prompthtml += '<td width="100%" colspan="2">&nbsp;&nbsp;&nbsp;<input type="text" name="val" style="width: 95%;"></td>';
prompthtml += '</tr>';
prompthtml += '</table>';
prompthtml += '</div>';

document.write(prompthtml);

</script>

</head>

<body onmousemove="return false;">
<a href="javascript: name();">name?</a>
</body>

</html>


Take a look, you might like.