|
HTML - Problem With Javascript
Hey guys / gals
I have been asking around in several forums but they didnt give me correct codes. I am so desperate to get it done. I am using HTML and javascript. Everything is working expect the price list (from table) linked to the dropdown list is not shown up. I inserted the javascript code for displaying image when selected item on the order list (dropdown list), it is working well but the price list linked to this dropdown list was not shown up. Something wrong with Javascript. Can you check up my below code where is incorrect? Your help much appreciated. I urgently need your help. Thanks Look at the red and blue code below: <head> <script type="text/javascript"> window.onload = function() { document.getElementById("dlist1").onchange = function() { var option = this.options[this.selectedIndex]; document.getElementById("price_card").innerHTML = option.getAttribute("data-card") ? option.getAttribute("data-card") : ""; document.getElementById("price_memo").innerHTML = option.getAttribute("data-memo") ? option.getAttribute("data-memo") : ""; document.getElementById("price_tags1").innerHTML = option.getAttribute("data-tags1") ? option.getAttribute("data-tags1") : ""; document.getElementById("price_tags4").innerHTML = option.getAttribute("data-tags4") ? option.getAttribute("data-tags4") : ""; document.getElementById("price_key").innerHTML = option.getAttribute("data-key") ? option.getAttribute("data-key") : ""; document.getElementById("price_fridge").innerHTML = option.getAttribute("data-fridge") ? option.getAttribute("data-fridge") : ""; } } // displaying image when selected item on the order list </script> <script type="text/javascript"> function swapImage1() { var image = document.getElementById("imageToSwap1"); var dropd = document.getElementById("dlist1"); image.src = dropd.value; }; </script> <script type="text/javascript"> function swapImage2() { var image = document.getElementById("imageToSwap2"); var dropd = document.getElementById("dlist2"); image.src = dropd.value; }; </script> </head> <body> <table width="700"> // it is an order list <tr> <td> <p class="Card">ORDER 1:</p> // It is the first dropdown list named order 1 </td> </tr> <tr> <td> <p class="Dropdown"> <select name="ORDER1" size="12" multiple="multiple" id="dlist1" onchange="swapImage1()" > <optgroup label="Sow Seeds of Love"> <option value="None">None</option> <option data-card="32.00" data-memo="62.00" data-tags1="8.50" data-tags4="1.80" data-key="30.00" data-fridge="40.00" value="Images/Order_names/SowSeeds/Faith01_yellow.jpg">Faith</option> <option data-card="35.00" data-memo="65.00" data-tags1="9.50" data-tags4="1.80" data-key="20.00" data-fridge="40.00" value="Images/Order_names/SowSeeds/Grace01_green.jpg">Grace</option> <option data-card="1.00" data-memo="2.00" data-tags1="3.00" data-tags4="4.00" data-key="5.00" data-fridge="6.00" value="Images/Order_names/SowSeeds/Hope01_blue.jpg">Hope</option> <option data-card="6.00" data-memo="5.00" data-tags1="4.00" data-tags4="3.00" data-key="2.00" data-fridge="1.00" value="Images/Order_names/SowSeeds/Peace01_pink.jpg">Peace</option> <option data-card="21.00" data-memo="22.00" data-tags1="23.00" data-tags4="24.00" data-key="25.00" data-fridge="26.00" value="Images/Order_names/SowSeeds/FlowerSeedSachet01_two girls.jpg">Flower Seed</option> </optgroup> </select> </p> </td> <td> //it should display image when selected item from the order list - it is working well <img class= "ImageToSwap" id="imageToSwap1" src="Images/DropdownImages.gif" width="147" height="207" /> </td> </tr> </table> //This price list is not shown up when selected item from the order 1 (first dropdown list) Why not shown up???. <table> <tr> <th>Description</th> <th>Price</th> </tr> <tr> <td><label><input type="radio" name="medium" value="card" /> Card A6 (blank)</label></td> <td id="price_card"></td> </tr> <tr> <td><label><input type="radio" name="medium" value="memo" /> Memo Book A6</label></td> <td id="price_memo"></td> </tr> <tr> <td><label><input type="radio" name="medium" value="tags4" /> Gift Tags (4 designs per packet)</label></td> <td id="price_tags4"></td> </tr> <tr> <td><label><input type="radio" name="medium" value="tags1" /> Gift Tags - Single - Assorted</label></td> <td id="price_tags1"></td> </tr> <tr> <td><label><input type="radio" name="medium" value="key" /> Key Rings Perspex</label></td> <td id="price_key"></td> </tr> <tr> <td><label><input type="radio" name="medium" value="fridge" /> Fridge Art</label></td> <td id="price_fridge"></td> </tr> </table> <table width="700"> // it is the second dropdown list named Order 2 <tr> <td> <p class="Card">ORDER 2:</p> </td> </tr> <tr> <td> <p class="Dropdown"> <select name="ORDER2" size="12" multiple="multiple" id="dlist2" onchange="swapImage2()" > <optgroup label="Sow Seeds of Love"> <option value="None">None</option> <option data-card="32.00" data-memo="62.00" data-tags1="8.50" data-tags4="1.80" data-key="30.00" data-fridge="40.00" value="Images/Order_names/SowSeeds/Faith01_yellow.jpg">Faith</option> <option data-card="35.00" data-memo="65.00" data-tags1="9.50" data-tags4="1.80" data-key="20.00" data-fridge="40.00" value="Images/Order_names/SowSeeds/Grace01_green.jpg">Grace</option> <option data-card="1.00" data-memo="2.00" data-tags1="3.00" data-tags4="4.00" data-key="5.00" data-fridge="6.00" value="Images/Order_names/SowSeeds/Hope01_blue.jpg">Hope</option> <option data-card="6.00" data-memo="5.00" data-tags1="4.00" data-tags4="3.00" data-key="2.00" data-fridge="1.00" value="Images/Order_names/SowSeeds/Peace01_pink.jpg">Peace</option> <option data-card="21.00" data-memo="22.00" data-tags1="23.00" data-tags4="24.00" data-key="25.00" data-fridge="26.00" value="Images/Order_names/SowSeeds/FlowerSeedSachet01_two girls.jpg">Flower Seed</option> </optgroup> </select> </p> </td> <td> // displaying image when select item from the second dropdown - it is working well <img class="ImageToSwap" id="imageToSwap2" src="Images/DropdownImages.gif" width="147" height="207" /> </td> </tr> </table> [color="RoyalBlue"]//This price list is also not shown up when selected item from the order 2 (second dropdown). Why not shown up???/COLOR] <table> <tr> <th>Description</th> <th>Price</th> </tr> <tr> <td><label><input type="radio" name="medium" value="card" /> Card A6 (blank)</label></td> <td id="Td1"></td> </tr> <tr> <td><label><input type="radio" name="medium" value="memo" /> Memo Book A6</label></td> <td id="Td2"></td> </tr> <tr> <td><label><input type="radio" name="medium" value="tags4" /> Gift Tags (4 designs per packet)</label></td> <td id="Td3"></td> </tr> <tr> <td><label><input type="radio" name="medium" value="tags1" /> Gift Tags - Single - Assorted</label></td> <td id="Td4"></td> </tr> <tr> <td><label><input type="radio" name="medium" value="key" /> Key Rings Perspex</label></td> <td id="Td5"></td> </tr> <tr> <td><label><input type="radio" name="medium" value="fridge" /> Fridge Art</label></td> <td id="Td6"></td> </tr> </table> </body> Thank you Natz Similar TutorialsI am trying to create a frontpage with a main image that is replaced by other images that can be clicked as thumbnails. I have succeeded in doing that, but am now looking to have a headline that links to another page in my site that would change as the images change. Here's my code, please help. <script language="javascript"> function swapPhoto(photoSRC) { document.images.imgPhoto.src = photoSRC; } </script> <table width=550 height=45 style="background-color: #000000" style="color: #ffffff"> <tr><td><center><p><font size=5 style="color: #ffffff">New Articles</p></font></center></tr></td> </table> <table width=550 style="text-align:center" border=3 style="border-color: #000000"> <tr><td border=5 style="border-color:#000000"> <img src="http://blog.masslive.com/parquetpride/2008/08/large_jr-giddens-huge.jpg" id="imgPhoto" width="510" height="340" alt="Main Image" /></tr></td> <tr><td border=5 style="border-color:#000000"><a href="javascript:swapPhoto ('http://blog.masslive.com/parquetpride/2008/08/large_jr-giddens-huge.jpg')"; return false;"><img src="http://blog.masslive.com/parquetpride/2008/08/large_jr-giddens-huge.jpg" width="123" height="82" border=0 /></a></a> <a href="javascript:swapPhoto ('http://cdn.picapp.com/ftp/Images/4/a/f/a/NBA_MAY_10_5253.JPG?adImageId=1825421&imageId=4792284')"; return false;"><img src="http://cdn.picapp.com/ftp/Images/4/a/f/a/NBA_MAY_10_5253.JPG?adImageId=1825421&imageId=4792284" width="123" height="82" border=0 /></a> <a href="javascript:swapPhoto ('http://cdn.picapp.com/ftp/Images/3/e/3/5/NBA_Summer_League_1d14.JPG')"; return false;"><img src="http://cdn.picapp.com/ftp/Images/3/e/3/5/NBA_Summer_League_1d14.JPG" width="123" height="82" border=0 /></a> <a href="javascript:swapPhoto ('http://cdn.picapp.com/ftp/Images/5/b/b/e/Kansas_State_v_d9d1.jpg?adImageId=1819870&imageId=3772329')"; return false;"><img src="http://cdn.picapp.com/ftp/Images/5/b/b/e/Kansas_State_v_d9d1.jpg?adImageId=1819870&imageId=3772329" width="123" height="82" border=0 /></a></tr></td> </table> Code: function send_onclick(frmName)
{
var bolSubmit;
bolSubmit = true;
if (frmName.email.value == "")
{
alert("You must enter an email address");
bolSubmit = false;
}
if (bolSubmit == true)
{
frmName.submit(frmName);
}
}
</script>
</head>
<body>
<form name="frmName" method="post" action="validate.asp">
Enter your name in the text box. If nothing is entered, a warning <br />
message will be displayed. Only when you enter something into the <br />
text box will the page be submitted. <br /><br />
Please enter your name : <input type="text" name="email" size="20" /><br />
<input type="button" name="butSent" value="Do it" onclick="return send_onclick(frmName)">
</form>
</body>
</html>
Hi there, I would like to know the purpose of having var bolSubmit in the code above. Also, why is it that "form name" allows my code to work even though there is a warning stating that it is outdated, but when I change it from "form name" to "form id", it does not complain of the warning anymore, but instead my code does not work. Please advise. I have been creating a website with Javascript. When the user rolls over an image button, the button will glow and when the user presses on the button it will change to and image of the button being pressed. This program has been working with at least 6 buttons but the current button i'm working on stops doing what the previous buttons did and I would like to know why. I copied the codes exactly the same as the previous buttons, changed the image picture and provided the correct links to each image but somehow it just stops working. Thank you for your help (: -=Example of the codes=- Button 1: <a href="'test2.htm" onMouseDown="pressButton('chatBtn');return true;" onMouseOver="overButton('chatBtn');return true;" onMouseOut="releaseButton('chatBtn');return true;"><img name=chatBtn src="images/chat.png" border="0" alt="Chat" /></a> Button 2: <a href='test.htm' onMouseDown="pressButton('backBtn');return true;" onMouseUp="overButton('backBtn');return true;" onMouseOut="releaseButton('backBtn');return true;"><img name=backBtn src="images/back.png" border="0" alt="Back" /></a> Javascript code: // Preloading Images if (document.images) { chatBtn_up = new Image(); chatBtn_up.src="images/chat.png"; chatBtn_down= new Image(); chatBtn_down.src="images/chatPress.png"; chatBtn_hover = new Image(); chatBtn_hover.src="images/chatHover.png"; backBtn_up = new Image(); backBtn_up.src="images/back.png"; backBtn_down= new Image(); backBtn_down.src="images/backPress.png"; backBtn_hover = new Image(); backBtn_hover.src="images/backHover.png"; } // Event Handlers for button function pressButton(btName) { if (document.images) eval('document.'+btName+'.src='+btName+'_down.src'); } function releaseButton(btName) { if(document.images) eval('document.'+btName+'.src='+btName+'_up.src'); } function overButton(btName) { if (document.images) eval('document.'+btName+'.src='+btName+'_hover.src'); } Can anyone tell me what is wrong with this timer. It does not work? HTML Code: function Timer(minutes, seconds)
{
var seconds;
var minutes;
var time = document.getElementById("timer");
if (seconds <= 0)
{
seconds = 9;
minutes -= 1;
}
if (minutes <= -1)
{
seconds = 0;
minutes += 1;
}
else
{
seconds -= 1;
time.innerHTML = minutes + ":" + seconds;
setTimeout("Timer(minutes, seconds)" , 1000);
}
}
On my website, I have a little box that appears on the home page that says "Loading, please wait". After about 4 seconds, the box closes with a javascript time out. But, on slow browsers, my page takes about 4 seconds to load before they see the "Loading" box, so, all the slow browsers see is my loading box for a millisecond, and then the 4 seconds is over. If I just put my Javascript timeout to 6 seconds, then its annoying for the fast browsers (and for me) because they have to wait 6 seconds to see the page. I want to knkow if its possible to have a timeout that only starts when the page is loaded! I have a problem with the setTimeout(); function My example: <script language="javascript"> <!-- setTimeout("document.write('<img src=...>')",3000); setTimeout("document.write('<img src=...>')",6000); //--> </script> When I execute it, the first img would be display but the second wouldn't. So I tried with other statements like this example: <script> setTimeout("alert('hello')",2000); setTimeout("alert('hello')",4000); </script> And this worked fine, the two alertboxes where displayed one after the other. Greets, Errorman Hey, For some reason my table portion of this code does not display... Also, my background color or my td color also do not display...HTML code is posted below. Any help would be awesome... Thanks! HTML Code: <html>
<head>
<title>Business Projection Site</title>
<style>
body {bacground-color: #00AAAA}
table {border-collapse: collapse}
td {background-color: rgb(0,230,0)}
</style>
<script>
L=211;
verty=Math.floor(L/20)*1.0;
function forecast(){
a1=parseFloat(document.form1.input1.value);
a2=parseFloat(document.form1.input2.value);
a3=parseFloat(document.form1.input3.value);
a4=parseFloat(document.form1.input4.value);
d1=a2-a1;
d2=a3-a2;
d3=a4-a3;
dmax=Math.max(Math.abs(d1),Math.abs(d2),Math.abs(d3));
dmin=Math.min(Math.abs(d1),Math.abs(d2),Math.abs(d3));
err=dmax-dmin;
avga=(a1+a2+a3+a4)/4.0;
erra=err/avga;
avgd=(d1+d2+d3)/3.0
r1=a2/a1;
r1=a3/a2;
r1=a4/a3;
rmax=Math.max(r1,r2,r3);
rmin=Math.min(r1,r2,r3);
errg=rmax-min;
avgr=(r1+r2+r3)/3.0;
if(errg<erra)stype="A";
else stype="g";
if(stype="A")
{ a5=a4*avgd;
a6=a5*avgd;
a7=a6*avgd;
a8=a7*avgd;
}
else{
a5=a4*avgr;
a6=a5*avgr;
a7=a6*avgr;
a8=a7*avgr;
}
document.form1.out1.value=a5.toFixed(2);
document.form1.out2.value=a6.toFixed(2);
document.form1.out3.value=a7.toFixed(2);
document.form1.out4.value=a8.toFixed(2);
msglin='Your data is more like a linear trend than a % growth. ';
msglin= msglin+'The average change per period is '+avgd;
msgexpgr='Your data is more like % growth than linear trend. ';
avgrgr =100.*(avgr-1.0);
avgrgr=avgrgr.toFixed(2);
msgexpred='Your data is more like % reduction than linear trend. ';
avgrred = 100.*(1.0-avgr);
avgrred=avgrred.toFixed(2);
msgexpred= msgexpred+'The average reduction per preiod is '+avgrred+'%';
if(stype=="A")document.form1.anal.value=msglin;
else if(avgr>1.0) document.form1.anal.value=msgexpgr;
else document.form1.anal.value=msgexpred;
}
function plot() {
var values=new Array (a1,a2,a3,a4,a5,a6,a7,a8);
var yt2=new Array(8);
var xt1=new Array(8);
var minPV=9999;
var maxPV=-9999;
for (i=0; i<8; i++){
if (values[i]<minPV)
minPV=values[i];
if (values[i]>maxPV)
maxPV=values[i];
}
for (i=0; i<8; i++){
yt2[i]=(values[i]-minPV)/(maxPV-minPV)*(L-(2*verty))+verty;
}
for (i=0; i<8; i++){
xt1[i]=Math.round((L-(2*verty))/(8-1)*i+verty);
}
for (i=0; i<4; i++){
line1(xt1[i], yt2[i], xt1[i+1], yt2[i+1], "#FFF7F7");
points (xt1[i], yt2[i], "#000000", 3);
}
for (i=4; i<8; i++){
line1(xt1[i], yt2[i], xt1[i+1], yt2[i+1], "00EEEE");
points (xt1[i], yt2[i], "#000000", 3);
}
function clearplot()
{
for(i=1;i<=L;i++){
for(j=1;j<=L;j++){
a=document.getElementById(j+","+i);
a=style.backgroundColor="#FF7777";
}
}
}
function point(xx1,yy1,color1)
{ yy1=Math.round(yy1);
xx1=Math.round(xx1);
idPoint=(L-yy1+1)+","+xx1;
cell1=document.getElementById(idPoint);
cell1.style.backgroundColor=color1;
}
function points(xx1,yy1,color1,n)
{ n2=Math.floor(n/2);
for(i1=0; i1<n; i1++)
for(j1=0; j1<n; j1++)
point(xx1-n2+i1,yy1-n2+j1,color1);
}
function line1(xx1, yy1, xx2, yy2, color1)
{ m=(yy2-yy1)*1.0/(xx2-xx1);
if (Math.abs(xx2-xx1) >= Math.abs(yy2-yy1))
{
for (j=xx1; j<=xx2; j++){
y=m*(j-xx1)+yy1;
point(j,y,color1);
}
}
else {
ymax=Math.max(yy1,yy2);
ymin=Math.min(yy1,yy2);
for(k=ymin; k<=ymax; k++){
x=(k-yy1)/m+xx1;
point(x,k,color1);
}
}
}
function expGrowth()
{ document.form1.input1.value="10.0";
document.form1.input2.value="20.0";
document.form1.input3.value="40.0";
document.form1.input4.value="80.0";
document.form1.out1.value='';
document.form1.out2.value='';
document.form1.out3.value='';
document.form1.out4.value='';
document.form1.analysis.value="";
}
function expReduction()
{ document.form1.input1.value="200.0";
document.form1.input2.value="100.0";
document.form1.input3.value="50.0";
document.form1.input4.value="25.0";
document.form1.out1.value='';
document.form1.out2.value='';
document.form1.out3.value='';
document.form1.out4.value='';
document.form1.analysis.value="";
}
function linGrowth()
{ document.form1.input1.value="10.0";
document.form1.input2.value="20.0";
document.form1.input3.value="30.0";
document.form1.input4.value="40.0";
document.form1.out1.value='';
document.form1.out2.value='';
document.form1.out3.value='';
document.form1.out4.value='';
document.form1.analysis.value="";
}
function linReduction()
{ document.form1.input1.value="40.0";
document.form1.input2.value="30.0";
document.form1.input3.value="20.0";
document.form1.input4.value="10.0";
document.form1.out1.value='';
document.form1.out2.value='';
document.form1.out3.value='';
document.form1.out4.value='';
document.form1.analysis.value="";
}
</script>
</head>
<body>
<h2>Revenue Projection</h2>
<form name='form1'>
<b>Enter 4 historical data points:</b>
<br/>
<pre>1. Enter at least 2 data points in this
section to forecast and plot your data.
2. Or click on one of the buttons below for
examples of linear or exponential growth,
or shrink or linear reductions growths.</pre>
<p>
<input type= 'textfield' size=15 name='input1' />
<input type= 'textfield' size=15 name='input2' />
<input type= 'textfield' size=15 name='input3' />
<input type= 'textfield' size=15 name='input4' />
<p>
<input type="button" value="Exponential Reduction" onclick="expReduction()"/>
<input type="button" value="Linear Reduction" onclick="linReduction()"/>
<input type="button" value="Linear Growth" onclick="linGrowth()"/>
<input type="button" value="Exponential Growth" onclick="expGrowth()"/>
<p>
<b>Predicted Future Values:</b>
<p>
<input type="text" name="out1" size=15 />
<input type="text" name="out2" size=15 />
<input type="text" name="out3" size=15 />
<input type="text" name="out4" size=15 />
<p><input type="button" value="Forecast" onclick="forecast()">
<p><input type="text" size="115" name="anal" />
</form>
<h4>Normalized Plot:</h4>
<p>
<input type="button" value="Plot Data" onclick="plot()">
<input type="button" value="Clear Plot Data" onclick="clearplot()">
<p>
<table>
<script>
for(i=0; i<L; i++){
document.write("<tr>");
for(j=0; j<L; j++){
document.write("<td id='"+i+","+j+"'>");
}
document.write("</tr>")
}
</script>
</table>
</body>
</html>
Hello everyone. Below is the html code for a quiz i want to use for my website. What I want to do is, upon completion of the quiz, have 2 new text-entry forms and 1 "submit" button form appear at the bottom of the page asking the user to input one's name and email address before they can submit the results of their quiz. Both fields would be required.. <html> <head> <meta http-equiv="Content-Language" content="en-us"> <meta http-equiv="Content-Type" content="text/html; charset=windows-1252"> <title>Knowledge Assessment Tool</title> <script src="assessment.js" type="text/javascript"></script> <script src="quiz.js" type="text/javascript"></script> <link rel="stylesheet" href="quiz.css" type="text/css"> </head> <body bgcolor="#FFFFFF"> <p><font color="#2431A2"><u><b>10 Point Quiz</b></u></font></p> <div id="quiz1"></div> <div id="quiz2"></div> ** </body> </html> ** denotes where the text and submit button would show up after the quiz is completed asking the user for name/email address. As you can tell I have no clue how to acheive this. Any help is greatly appreciated. Thank you. Hi. My entire site is 100% XHTML1.1. Except for some new code I added which causes errors in validation. the code is HTML Code: <a href="http://babelfish.altavista.com/babelfish/" onclick="window.open('http://babelfish.altavista.com/babelfish/trurl_pagecontent?lp=en_it&url='+encodeURIComponent(location.href));return false;" title="Translate to Italian"><img title="Italian" src="http://geekimo.com/licons/it.png" alt="Italian" /></a>
I understand maybe CDATA islands can help with this? or making it external? but I have no idea how to do that with it having html code in there too.. I don't know if you can surround it in CDATA tags. There are other lines of code too, exactly the same except have different languages. Any help would be awesome! Hey everyone, I'm having a problem with a Flash .swf file in my HTML page. If I input the code one way, it works in Firefox and not in IE. If I do it another way, it works in IE and not Firefox. The approach I was thinking of taking was using conditional statements in Javascript, however I'm having problems arranging the code to properly implement it. And believe me, I've reworked this file and I'm getting nothing that works on both at the same time. Suggestions for both methods would be great -- If you'd like me to post the code I could do so. Thank you! So I've been trying to set up a search box to blank out its default text when clicked, and reappear when it goes away (if empty). The script works fine--I know that much. However, when using it inside a table inside a form, it seems to fail every single time. Even "this.value=' ' " falls flat on its face. I'm relatively new to HTML, so please bear with me. Below is the script, a text box it does work in, and then the box I'm trying to make it work in. Quote: <script type="text/javascript"> function clickIn(field){ if (field.value==field.defaultValue){ field.value=''; } } function clickOut(field){ if (field.value==''){ field.value=field.defaultValue; } } </script> <form> <input type="text" name="text" id="test" value="test" onfocus="clickIn(this)" onblur="clickOut(this)"/> </form> <form> <tr> <td style="border-style:solid;border-color:#4B7B9F;border-width:1px;"> <!--Search Box Dimensions--> <input type="text" title="Search Terms" name="lookfor" id="search" value="Search the Catalog" onfocus: "clickIn(this)" onblur="clickOut(this)" style="width:300px; border:0px solid; height:50px; padding:0px 3px; position:relative;"/> </td> <td style="border-style:solid;border-color:#4B7B9F;border-width:1px;"> <!--The search button--> <input type="image" value="Go" src="Search Button.jpg" style="border-style: none; width: 50px; height: 50px;"/> </td> </tr> </table> </form> I have this: Code: <script language="Javascript1.2">
document.write('<a href=onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('nav_email','','images/nav_email-over.gif',1)" "javascript:void(0)" onclick=window.open("/recommend/recommend.php?loc='+window.location.href+'","","height=280,width=230,top=150,left=300,toolbar=no,menubar=no,location=no,status=no,resizable=0")><img src="images/nav_email.gif" alt="email page" name="nav_email" width="29" height="24" class="imgborder1"></a>');
</script>
but the image wont show up. I have an image that has a mouseover/out rollover effect. I also have it pop up a new window with a "recommend this page to a friend" script. I can't figure out why the image wont show up, it's like it's invisible. I would like to have an image that takes 2 url like the following image... is it possible? if so, can someone please tell me how this could be done? Thank you very much.. NOTE: I tried doing this... <map name= 'url1' > <area shape= 'poly' coords= ' 0 , 0 , 50 , 0 , 0 , 50 ' href= 'url1.html' > </map> <a href= 'url2.html' > <img src= 'img.jpg' width= 50 height= 50 usemap= '#url1' > </a> but this only get 'url1' woring... Okay, I know that this problem is going to be really really easy, but I forgot how to do it. I use to own an older website and forgot the code. Anyways, I only know how to describe it. When I minimize the screen, it is minimizing the whole thing and collapsing it making the iframes smaller and the text fit into a smaller space. Most websites have a code (i don't know what it is) so that when someone minimizes their browser, it just makes the browser smaller and not the actual page. Here's what it looks like: http://www.freewebs.com/noeylani94/index.htm Try minimizing that and see how it looks. It collapses the whole page right? Can someone tell me the code how to fix it? Thanks =D I am currently working on a currency converter for my D&D website and have run into a bit of a problem. The basic idea is to select the appropriate currency you have from a row of radio buttons, insert the amount you have in a text area and in the next text area it will kick out a list of different currencies and the amount you will have in those currencies. My problem is that my JAVA skills are extremely poor. I figured out how to set up most of it but I cannot figure out how to grab the input and plug it into my formulas. Can anyone help me with this? Here is a link to the page: Currency Converter Any and all hope is greatly appreciated. Thanks. Take care and have a great day.... ciao, john., Here is the basic code without the web page info: Code: <script type = "text/javascript">
function radio_map(prefix)
{
var coins; // The type of coin selected
// Go through all options to find the one that was selected
for (cnt = 0; cnt < prefix.cointype.length; cnt++) {
// If the coin was selected, checked will be true
if (prefix.cointype[cnt].checked)
coins = cnt; // Save that coin number
}
switch (coins) {
// Copper
case 0: prefix.matharea.value = "\n" +
1 * 1 + " Copper Coins \n" +
1 * .1 + " Silver Coins \n" +
1 * .01 + " Gold Coins \n" +
1 * .005 + " Platinum Coins \n" +
1 * .0001 + " Mithril Coins \n";
break;
// Silver
case 1: prefix.matharea.value = "\n" +
1 * 10 + " Copper Coins \n" +
1 * 1 + " Silver Coins \n" +
1 * .1 + " Gold Coins \n" +
1 * .05 + " Platinum Coins \n" +
1 * .001 + " Mithril Coins \n";
break;
// Gold
case 2: prefix.matharea.value = "\n" +
1 * 100 + " Copper Coins \n" +
1 * 10 + " Silver Coins \n" +
1 * 1 + " Gold Coins \n" +
1 * .5 + " Platinum Coins \n" +
1 * .01 + " Mithril Coins \n";
break;
// Platinum
case 3: prefix.matharea.value = "\n" +
1 * 1000 + " Copper Coins \n" +
1 * 10 + " Silver Coins \n" +
1 * 5 + " Gold Coins \n" +
1 * 1 + " Platinum Coins \n" +
1 * .1 + " Mithril Coins \n";
break;
// Mithil
case 4: prefix.matharea.value = "\n" +
1 * 10000 + " Copper Coins \n" +
1 * 1000 + " Silver Coins \n" +
1 * 100 + " Gold Coins \n" +
1 * 5 + " Platinum Coins \n" +
1 * 1 + " Mithril Coins \n";
break;
}
}
</script>
<form name="frmRadio">
<p> Please choose your coin type.</p>
<div onclick ='radio_map(document.frmRadio)'>
<input type="radio" name="cointype" value="Evanston"> Copper
<input type="radio" name="cointype" value="Arlington Hts."> Silver
<input type="radio" name="cointype" value="Oakbrook"> Gold
<input type="radio" name="cointype" value="Downers Grove"> Platinum
<input type="radio" name="cointype" value="Vernon Hills"> Mithril
</div>
Please input the number of coins that you have:
<textarea name="coinarea" rows=1 cols=35> </textarea>
Here are your converted coin numbers:
<textarea name="matharea" rows=10 cols=35> </textarea>
</form>
OK so I'm making an application and I've hit a snag with my Javascript. So I have a form and a list with some value, and under the list I have a button (not a submit) HTML Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<script type="text/javascript">
<!--
function popUp(URL,WIDTH,HEIGHT){
day = new Date();
id = day.getTime();
var user = document.getElementById('user').value;
eval("page" + id + " = window.open(URL, '"+ id + "', 'toolbar=1,scrollbars=0,location=0,statusbar=0,menubar=0,resizable=0,width="+WIDTH+",height="+HEIGHT+",left = 362,top = 234');");
}
</script>
<style type="text/css">
form{
margin: 0px;
}
.menu{
width: 200px;
}
#mem_list{
width: 200px;
}
</style>
</head>
<body>
<div id="mem_list">
<center>
Online User Info
</center>
<form method="get" action="/antrix/index.php">
<select name="color" size="5" class="menu" id="user">
<option value="Marlo">Marlo level 70 Warrior</option>
<option value="Dsadasd">Dsadasd level 1 Warlock</option>
<option value="Dsadasdd">Dsadasdd level 1 Priest</option>
<option value="Asdassg">Asdassg level 1 Rogue</option>
</select>
<center>
<input type="button" value="user options" onclick="javascript:popUp('mailmod.php','800','200')"/>
</center>
</form>
</div>
</body>
</html>
OK so when someone clicks the user options button i want the popup to go to the url and have the selected name in the GET value of the url like: mailmod.php?user=marlo if Marlo was selected. anyone got any ideas? *EDIT* yeh just realised this was in the wrong section, sorry ^_^ Hope this is the correct place for this question. What I want to do is have a webpage which asks a question, e.g. "What is your name?" and when the user enters a name, e.g. "Bob" a button pops up with "are you ready?" The user clicks that button and the page then tells the visitor: "Good morning, Bob; nice to see you" (or the button could be there from the beginning; it does not have to pop up) Just want this to learn how to do this and hope I can carry on from there. I am assuming I need a javascript to do this. For the website I'm working on i want to store the text someone enters in an imput box to be stored as a variable so i can have an alert that welcomes them to my site. any suggestions. this one isn't illegal. hi, i have a problem with my javascript---i have an image changer, and when you click on the name of the image it changes the image and the link to view the full size image. in firefox and chrome, this works fine, but in IE it displays only the URL for the image on click. the website is http://sc-lee.com/art.html , to view/test, and the code is: Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<link href="branch2.css" rel="stylesheet" type="text/css" />
<script>
var thelink = 'http://sc-lee.com/art/2l.jpg';
</script>
</head>
<body>
<div id="navss"><B>OTHER WORK</B>
<a href="art.html">paintings & drawings</a>
/ <a href="collage.html">collage</a>
/ <a href="graphics.html">graphics</a>
</div>
<div id="back"><a href="javascript: history.go(-1)">< back</a></div>
<div id="contenta">
<img src=art.gif />
<br>
<br><a href="javascript: document.getElementById('img1').src='http://sc-lee.com/art/2.jpg'; var thelink = 'http://sc-lee.com/art/2l.jpg'">ONE</a>
<br><a href="javascript: document.getElementById('img1').src='http://sc-lee.com/art/1.jpg'; var thelink = 'http://sc-lee.com/art/1l.jpg'">TWO</a>
<br><a href="javascript: document.getElementById('img1').src='http://sc-lee.com/art/3.jpg'; var thelink = 'http://sc-lee.com/art/3l.jpg'">THREE</a>
<br><a href="javascript: document.getElementById('img1').src='http://sc-lee.com/art/4.JPG'; var thelink = 'http://sc-lee.com/art/4l.jpg'">FOUR</a>
<br><a href="javascript: document.getElementById('img1').src='http://sc-lee.com/art/5.jpg'; var thelink = 'http://sc-lee.com/art/5l.jpg'">FIVE</a>
<br><a href="javascript: document.getElementById('img1').src='http://sc-lee.com/art/6.jpg'; var thelink = 'http://sc-lee.com/art/6l.jpg'">SIX</a>
<br><a href="javascript: document.getElementById('img1').src='http://sc-lee.com/art/7.jpg'; var thelink = 'http://sc-lee.com/art/7l.jpg'">SEVEN</a>
<br><a href="javascript: document.getElementById('img1').src='http://sc-lee.com/art/9.jpg'; var thelink = 'http://sc-lee.com/art/9l.jpg'">EIGHT</a>
<br><a href="javascript: document.getElementById('img1').src='http://sc-lee.com/art/11.jpg'; var thelink = 'http://sc-lee.com/art/11l.JPG'">NINE</a>
</div>
<div id="contentb">
<img id="img1" name="mainimage" src="http://sc-lee.com/art/2.jpg">
<br /> <a href="#" onclick="javascript: window.open(thelink); ">
+ fullsize</a>
</div>
</body>
</html>
i'm afraid i just don't know enough about the differences between IE and firefox javascript compatability to fix this. please help!
thanks,
stephanie
|
|||||||