JavaScript - How To Make It Only One Single Radio Button's Things Display When Page Load?
Here are the coding..
Code: <jsp:useBean id="chequeStopBean" scope="session" class="my.com.infopro.ibank.ui.bean.ChequeStopBean"/> <jsp:useBean id="labelBean" scope="session" class="my.com.infopro.ibank.ui.bean.LabelBean"/> <jsp:useBean id="lang" scope="session" class="my.com.infopro.ibank.ui.bean.LanguageBean" /> <%@ page language="java" import = "java.util.*" errorPage="" %> <%@ page import="my.com.infopro.ibank.dto.ChequeDTO"%> <% request.getSession(true); String contextPath = request.getContextPath(); chequeStopBean.queryAccList(); //RequestDispatcher dispatcher = null; %> <html> <head> <title><%=labelBean.getLabel("STOP_CHEQUE")%></title> <meta HTTP-EQUIV="Pragma" content="no-cache"> <meta HTTP-EQUIV="Expires" content="-1"> <jsp:include page="/ScriptHeader.jsp"/> <script language="javascript"> function validateAndSubmit() { var msg1 = "<%=labelBean.getLabel("MSG_REQUIRED_FIELD")%>"; var msg2 = "<%=labelBean.getLabel("MSG_CANNOT_CONTAIN_CHARACTER")%>"; var msg3 = "<%=labelBean.getLabel("MSG_IN_THE_FIELD")%>"; var msg4 = "<%=labelBean.getLabel("MSG_PLEASE_ENTER")%>"; var msg5 = "<%=labelBean.getLabel("WITH")%>"; var msg6 = "<%=labelBean.getLabel("TO")%>"; var msg7 = "<%=labelBean.getLabel("MSG_CHARACTER")%>"; var msg8 = "<%=labelBean.getLabel("MSG_PLEASE_ENTER_VALID_NUMBER")%>"; var msg9 = "<%=labelBean.getLabel("MSG_REQUIRED_FIELD")%>"; var msg10 = "<%=labelBean.getLabel("MSG_WITH_EXACTLY")%>"; var msg11 = "<%=labelBean.getLabel("MSG_WITH_VALID_DATE")%>"; var msg12 = "<%=labelBean.getLabel("MSG_EXAMPLE_DATE")%>"; var msgNum11 = "<%=labelBean.getLabel("MSG_WITH_A_MINIMUM_VALUE_OF")%>"; var msgNum12 = "<%=labelBean.getLabel("MSG_WITH_A_MAX_VALUE_OF")%>"; var msgNum13 = "<%=labelBean.getLabel("MSG_PLEASE_ENTER_ROUND_INETEGER")%>"; var msgNum14 = "<%=labelBean.getLabel("MSG_PLEASE_ENTER_AT_MOST")%>"; var msgNum15 = "<%=labelBean.getLabel("MSG_DECIMAL_PLACES")%>"; var msgEnter = "<%=labelBean.getLabel("MSG_PLEASE_ENTER_VALID")%>"; var errorMsg = "<%=labelBean.getLabel("MSG_LOWECASE_ALPHABET_ALLOWED")%>" var radioButtons = document.getElementsByName("radio"); for (var x = 0; x < radioButtons.length; x ++) { if (radioButtons[x].checked) { if(radioButtons[x].value=="1") { if (! validateTextEntry(form.chqNum, "<%=labelBean.getLabel("CHQNUM")%>" + " ", true,11,11, msg1, msg2, msg3, msg4, msg5, msg6, msg7, msg10) ) return false; if (! validateAlphabet(form.chqNum, "" + " ",1, msg2,"" )) return false; } else if(radioButtons[x].value=="2") { if (! validateTextEntry(form.chqNumFrom, "<%=labelBean.getLabel("CHQNUMFROM")%>" + " ", true,11,11, msg1, msg2, msg3, msg4, msg5, msg6, msg7, msg10) ) return false; if (! validateTextEntry(form.chqNumTo, "<%=labelBean.getLabel("CHQNUMTO")%>" + " ", true,11,11, msg1, msg2, msg3, msg4, msg5, msg6, msg7, msg10) ) return false; if (! validateAlphabet(form.chqNumFrom, "" + " ",1, msg2,"" )) return false; if (! validateAlphabet(form.chqNumTo, "" + " ",1, msg2,"" )) return false; if(form.chqNumFrom.value == form.chqNumTo.value){ alert("<%=labelBean.getLabel("MSG_CANNOT_SAME")%>"); return false; } } } } return true; } function show(id) { if (document.getElementById(id).style.display == 'none') { document.getElementById(id).style.display = 'block'; } } //--> <!-- function hide(id) { document.getElementById(id).style.display = 'none'; } </script> </head> <body onload="show('single')"> <form name="form" method="POST" action="<%=contextPath%>/ChequeStopServlet?tranx=confirm" dir="<%=lang.getDir()%>" > <table width="500" align="center"> <tr> <td align="left" colspan="3"> </td> </tr> <tr> <td align="left" colspan="3" class="mainHeader"><%=labelBean.getLabel("STOP_CHEQUE")%></td> </tr> <tr> <td colspan="3"> </td> </tr> <tr> <td colspan="3" class="subHeader"><%=labelBean.getLabel("CHQ_DETAIL") %></td> </tr> <tr> <td colspan="3"><div align="center"> <p class="statusError"> <%if(request.getParameter("error") != null) out.println(labelBean.getLabel(request.getParameter("error"))); else out.println("");%> </p> </div></td> </tr> </table><br /> <table width="500" align="center"> <tr> <td class="lbl"><span class="requiredFieldIndicator">* </span><%=labelBean.getLabel("ACC_NUMBER")%></td> <td width="10" class="lbl">:</td> <td width="305" align="left"> <select size="1" name="accNum"> <% for (Iterator iter = chequeStopBean.getAccList().iterator(); iter.hasNext();) { ChequeDTO chqDto = (ChequeDTO)iter.next(); %> <option value="<%=chqDto.getAccNum()%>"><%=chqDto.getAccNum()%></option> <% } %> </select> </td> </tr> <tr> <td align="right"> <input type="radio" class="radioStyle" name="radio" value="1" onfocus="show('single');hide('multiple');hide('multiple1');return true;" checked="checked" > <%=labelBean.getLabel("STOP_SINGLE")%> </td> <td> </td> <td> <input type="radio" class="radioStyle" name="radio" value="2" onfocus="hide('single');show('multiple');show('multiple1');return true;"> <%=labelBean.getLabel("STOP_MULTIPLE")%> </td> </tr> <tr id="single"> <td class="lbl"><span class="requiredFieldIndicator">* </span><%=labelBean.getLabel("CHEQUE_NUMBER")%></td> <td class="lbl"width="10">:</td> <td colspan="2" align="left"> <input name="chqNum" type="text" size="15"> </td></tr> <tr id="multiple" style="display: 'none'"> <td class="lbl"><span class="requiredFieldIndicator">* </span><%=labelBean.getLabel("FROM_CHEQUE_NUMBER")%></td> <td class="lbl"width="10">:</td> <td colspan="2" align="left"> <input name="chqNumFrom" type="text" size="15"> </td></tr> <tr id="multiple1" style="display: 'none'"> <td class="lbl"><span class="requiredFieldIndicator">* </span><%=labelBean.getLabel("TO_CHEQUE_NUMBER")%></td> <td class="lbl"width="10">:</td> <td colspan="2" align="left"> <input name="chqNumTo" type="text" size="15"> </td></tr> <tr> <td class="lbl"><span class="requiredFieldIndicator">* </span><%=labelBean.getLabel("REASON")%></td> <td class="lbl" width="10" >:</td> <td colspan="2"> <select name="reason"> <option value="Lost"><%=labelBean.getLabel("LOST")%></option> <option value="Stolen"><%=labelBean.getLabel("STOLEN")%></option> <option value="Payment Cancellation"><%=labelBean.getLabel("PAYMENT_CANCELLATION")%></option> <option value="Others"><%=labelBean.getLabel("OTHERS")%></option> </select> </td> </tr> <br/> <tr> <td colspan="3"> </td> </tr> <tr> <td colspan="3" align="center"> <input class="button" type="submit" value="Next" onClick="return validateAndSubmit();" > </td> </tr> <tr> <td colspan="3"> </td> </tr> <tr> <td colspan="3" align="left" class="footer"><%=labelBean.getLabel("NOTE")%> </td> </tr> <tr><td colspan="3" class="footer"> <ul> <li><%=labelBean.getLabel("THE_ASTERISK")%></li> </ul> </td> </tr> </table> <jsp:include page="/Footer.jsp" /> </form> </body> </html> This is error for the first page.. This is picture that which i wan.. Thanks! Similar TutorialsHey all, I'm trying to make it so that when a user clicks on a radio button, the image that is related to the radio button is displayed next to it (without reloading the page). At the moment all it shows is the image related to the currently saved option, which I'd like to keep on page load. Is this possible? If so, I'd appriciate any help. Here is my code for the radio buttons. Thanks. Code: <tr valign="top"> <td id="community-legal-services-logo-selection"> <p><label><?php _e('<strong class="table_tags">Display the following Community Legal Services logo:</strong>'); ?></p> <p><label for="cls-mono"> <input class="" id="cls-mono" name="cls_logo" type="radio" value="cls_mono" <?php if($general_options['cls_logo'] === 'cls_mono'){ echo 'checked="checked"'; } ?> /> <?php _e('Mono'); ?></label> </p> <p><label for="cls-color"> <input class="" id="cls-color" name="cls_logo" type="radio" value="cls_color" <?php if($general_options['cls_logo'] === 'cls_color'){ echo 'checked="checked"'; } ?> /> <?php _e('Colour'); ?></label> </p> <p><label for="cls-none"> <input class="" id="cls-none" name="cls_logo" type="radio" value="cls_none" <?php if($general_options['cls_logo'] === 'cls_none'){ echo 'checked="checked"'; } ?> /> <?php _e('None'); ?></label> </p> <p> <label><?php _e('<span class="table_tags">Link to the Community Legal Services website<span>'); ?></label> </p> <p> <input class="large_input_box" id="cls-link" name="cls_link" type="text" value="<?php echo $general_options['cls_link']; ?>" /></label> </p> </td> <?php if($general_options['cls_logo'] && $general_options['cls_logo'] !== 'cls_none'){ ?> <td> <img id="community-legal-services-logo-preview" class="image-preview" src="<?php echo $general_options['cls_logo_path']?>" /> </td> <?php } ?> </tr> I would like to display one of two different <div> tags based on a radio button. In essence, this would be the "basic" and "advanced" options as the user end. Can this be done easily or will it be complex? Another task please...I need to display the appropriate div when a radio button is selected... PHP Code: <body> <script type="text/javascript"> function checkjob(jobvalue){ if(jobvalue="type") { document.getElementById("type").style.display = "block"; }else if(jobvalue="select"){ document.getElementById("select").style.display = "block"; }else if(jobvalue="tag"){ document.getElementById("tag").style.display = "block"; } } </script><br /> <table width="200"> <tr> <td><label> <input type="radio" name="cat" value="type" id="cat_0" onchange="checkjob(this.value)" /> type</label></td><td><label> <input type="radio" name="cat" value="select" id="cat_1" onchange="checkjob(this.value)" /> select</label></td> <td><label> <input type="radio" name="cat" value="tag" id="cat_2" onchange="checkjob(this.value)" /> tag</label></td> </tr> </table> <div id="type" style="display:none"><input name="contact" type="text" /></div> <div id="tag" style="display:none">tag:<input name="contact" type="text" /></div> <div id="select" style="display:none"><select name=""> <option value="a" selected="selected">option 1</option> <option value="b">option 2</option> </select></div> </body> I need a script that will allow a user to select a vertical selection and Horizontal selection that displays a corresponding image. There are only 8 combinations (4 vertical choices and 2 horizontal choices) I just need to display the correct image and a description. There has to be only one of each selected and only display one image. I have tried several and have had no luck. Any ideas? Here is how the layout will look here is the html code that i have PHP Code: <td valign="middle" valign="middle"> <input type="radio" name="gender" id="genderM" value="Male" /> Male <input type="radio" name="gender" id="genderFM" value="Female" /> Female </td> and here is the js funtion PHP Code: var $j = jQuery.noConflict(); function isValidEmail(str) { return (str.indexOf(".") > 2) && (str.indexOf("@") > 0); } function validateForm(){ var firstName; var lastName; var email; var mobile; var comment; var error; firstName = $j('#firstName').val(); lastName = $j('#lastName').val(); email = $j('#email').val(); mobile = $j('#mobile').val(); comment = $j('#comment').val(); if(firstName=='' || firstName.length < 3){ error = 'Please Enter Your First Name'; $j('#errormsg').html('<p class="errors">'+ error +'</p>'); return false; } if(lastName=='' || lastName.length < 3){ error = 'Please Enter Your Second Name'; $j('#errormsg').html('<p class="errors">'+ error +'</p>'); return false; } //mob //$jmob_pattern = '^\d{10}$j'; if(mobile.length != 10 || isNaN(mobile)){ error = 'Please Enter Your Mobile Number'; $j('#errormsg').html('<p class="errors">'+ error +'</p>'); return false; } if(email=='' || !isValidEmail(email)){ error = 'Please Enter Your Email Address'; $j('#errormsg').html('<p class="errors">'+ error +'</p>'); return false; } if(comment.length < 5){ error = 'Please Enter A Comment'; $j('#errormsg').html('<p class="errors">'+ error +'</p>'); return false; } return true; } Does anybody know how i check to see if the radio button is select and also can anybody tell me how i can check for an email in the correct format the function isValidEmail in the above alows emails to pass through if they are in this format aaa@aaa. i only want them to go through if they are aaa@aaa.com Thanks for your help if you give it Hi Guys, I'm fairly new to Javascript and would be grateful for any help you can give me. I've had a search on Google and found a couple of potential solutions but nothing seems to work quite right for what I need. Basically I have a form with several questions followed by Yes/No radio buttons. Dependent on which answer is given, I want to display a different message above the text box. For example, if you answered 'no' to a certain question then the message above the text box would change to say "Please fill in additional information" or something along those lines. Below is the HTML to give you an idea of what I mean. Code: <table> <tr> <td> </td> <td><label class="bold">Yes</label></td> <td><label class="bold">No</label></td> </tr> <tr> <td><label for="property_q1"> - Is this your house?</label></td> <td><input name="property_q1" id="property_q1" type="radio" value="Yes" /></td> <td><input name="property_q1" id="property_q1" type="radio" value="No" /></td> </tr> </table> <br /> <div id="fine">It's fine, don't worry about filling it in.</div> <div id="fill" style="display:none">Please fill in the form below.</div> <table> <tr> <td> </td> </tr> <tr> <td><textarea name="info" id="info" cols="60" rows="5"></textarea></td> </tr> </table> <input type="submit" /> Evening all, I am new here and seeking some helping modifying this existing code that I found so that it will allow me to run 3 scrollers within the same page. I have tried to rename the variables and other elements within the script but still no luck.... I appreciate the responses: Code: <script type="text/javascript"> var goleftimage='images/left_arrow_1.jpg' var gorightimage='images/right_arrow_1.jpg' var menuwidth=380 var menuheight=60 var scrolldir="normal" var scrollspeed=6 var menucontents='<nobr><center>SCROLLING CONTENT HERE</center></nobr>' var iedom=document.all||document.getElementById var rightdircode='onMouseover="moveleft()" onMouseout="clearTimeout(lefttime)"' var leftdircode='onMouseover="moveright()" onMouseout="clearTimeout(righttime)"' if (scrolldir=="reverse"){ var tempswap=leftdircode leftdircode=rightdircode rightdircode=tempswap } if (iedom) document.write('<span id="temp" style="visibility:hidden;position:absolute;top:-100;left:-5000">'+menucontents+'</span>') var actualwidth='' var cross_scroll, ns_scroll var loadedyes=0 function fillup(){ if (iedom){ cross_scroll=document.getElementById? document.getElementById("test2") : document.all.test2 cross_scroll.innerHTML=menucontents actualwidth=document.all? cross_scroll.offsetWidth : document.getElementById("temp").offsetWidth } else if (document.layers){ ns_scroll=document.ns_scrollmenu.document.ns_scrollmenu2 ns_scroll.document.write(menucontents) ns_scroll.document.close() actualwidth=ns_scroll.document.width } loadedyes=1 } window.onload=fillup function moveleft(){ if (loadedyes){ if (iedom&&parseInt(cross_scroll.style.left)>(menuwidth-actualwidth)){ cross_scroll.style.left=parseInt(cross_scroll.style.left)-scrollspeed+"px" } else if (document.layers&&ns_scroll.left>(menuwidth-actualwidth)) ns_scroll.left-=scrollspeed } lefttime=setTimeout("moveleft()",50) } function moveright(){ if (loadedyes){ if (iedom&&parseInt(cross_scroll.style.left)<0) cross_scroll.style.left=parseInt(cross_scroll.style.left)+scrollspeed+"px" else if (document.layers&&ns_scroll.left<0) ns_scroll.left+=scrollspeed } righttime=setTimeout("moveright()",50) } if (iedom||document.layers){ with (document){ write('<table border="0" cellspacing="0" cellpadding="1">') write('<td valign="middle"><a href="#" '+leftdircode+'><img src="'+goleftimage+'"border=0></a> </td>') write('<td width="'+menuwidth+'px" valign="top">') if (iedom){ write('<div style="position:relative;width:'+menuwidth+'px;height:'+menuheight+'px;overflow:hidden;">') write('<div id="test2" style="position:absolute;left:0;top:0">') write('</div></div>') } else if (document.layers){ write('<ilayer width='+menuwidth+' height='+menuheight+' name="ns_scrollmenu">') write('<layer name="ns_scrollmenu2" left=0 top=0></layer></ilayer>') } write('</td>') write('<td valign="middle"> <a href="#" '+rightdircode+'>') write('<img src="'+gorightimage+'"border=0></a>') write('</td></table>') } } </script> I will include this within a php page and the menu contents will be dynamically pulled from a database, I can handle populating the menucontents however, I have failed to be able to have more than one scroller on the page at once. Thanks How do I make a swf pop up, on load, on a home page? Similar to the lightbox technique, I want an swf file to pop up on the home page when it first loads. I have looked into a similar type of script called "milkbox" but have had no luck. Any Advice would be greatly appreciated as I need this working within a day. Thank you so much and sorry if this should be posted in the Flash Section. On this website... http://livedemo00.template-help.com/...21/index.html# When you click on the Navigation Bar the website pages load inside that page? How exactly would i go around doing this? Thankyou Hi All, Im new to this forum...need some of your help and advice. I have a js code like this : <script type="text/javascript"> <!-- var sipPos = 0; $(document).ready(function() { $("#panel-tab").click(function(e) { //if(autoTimer) clearTimeout(autoTimer); //autoTimer = null; e.preventDefault(); $("#panel").animate({ left: sipPos }, 1764, 'linear', function() { if(sipPos == 0) { sipPos = -856; } else { sipPos = 0; } }); }); }); --> </script> what it does is that it hide and show a panel by slidint it to the left. But my client want that on page load the panel opens automatically for about 2-3 seconds just to let users know that its here. So ive written this : <script type="text/javascript"> <!-- var sipPos = 0; $(document).ready(function() { var autoTimer = null; autoTimer = setTimeout(function(){ $("#panel").animate({ left: sipPos }); autoTimer = setTimeout(function(){ $("#panel").animate({ left: sipPos = -856 }); }, 2000); },1000); $("#panel-tab").click(function(e) { //if(autoTimer) clearTimeout(autoTimer); //autoTimer = null; e.preventDefault(); $("#panel").animate({ left: sipPos }, 1764, 'linear', function() { if(sipPos == 0) { sipPos = -856; } else { sipPos = 0; } }); }); }); --> </script> But when the panel finished showing the button to open it again doesn't work...any help please..really urgent. thks //Sam I have a single webpage that contains information on all 50 U.S. states. There are 50 links at the top to jump down to the state you want, and at the bottom of the information for each state a Back to Top link. I'm making the Back to Top link into something more complex, and it will require three or four lines of code. So that I don't have to repeat the code 50 times, and create a burden when I need to edit it, I want to place it in a .js file and call it x. Then below the information for each state I'll simply have: Code: <script language="JavaScript">document.write(x)</script> Does calling code from a .js file 50 times slow down the page load? Which method would load faster? Or is the difference negligible? Thank you, Peter how can i make a button disable when the page is loaded first time and then make it enable on the click of other button in javascript.
Hope someone can help. i have this script I found that i think does what i am looking for but i cant seem to get it to work.I think I am just overlooking something. I have a group of radio buttons in a form on a page and i am trying to get the value and image attached to the chosen radio button to pass to another form on another page.here is what i have so far. form 1 page named - giftcards.html Code: <form action="GIFTCERTIFICATES.html" name="giftcardstyle"> <input name="giftcardstocknumber" type="radio" value="BBA - 006"/> <img src="GIFTCARDS/004 BASIC4.jpg" alt="bba-006" style="width: 150px; height: 100px"> form 2 new page named - giftcertificates.html Code: <SCRIPT LANGUAGE="JavaScript" type="text/javascript"><!-- function getParm(string,parm) { // returns value of parm from string var startPos = string.indexOf(parm + "="); if (startPos > -1) { startPos = startPos + parm.length + 1; var endPos = string.indexOf("&",startPos); if (endPos == -1) endPos = string.length; return unescape(string.substring(startPos,endPos)); } return ''; } var passed = location.search.substring(1); document.f1.giftcardstocknumber.value = getParm(passed,'giftcardstocknumber'); document.formname.otherfield.value = getParm(passed,'otherfield'); //--></SCRIPT> <input type="text" name="giftcardstocknumber"/> <img src="" style="width: 150px; height: 100px"/> Hi. I am new here. I wanted help for a JavaScript code. You might think I'm lazy for not writing it myself, but the truth is I am not a JavaScript coder. I just have a really simple website and I am trying to do something for which I know JS is required but I don't know how to do it. I've also searched around but couldn't find the appropriate code. What I want to do is to make an html page load a different background image every time it refreshes. I will have a list of background images and I want to be able to add in this list, without having to change anything else in the codes after I do this (I think this is made by making an array of images and by putting .length somewhere in the codes, but I don't know exactly how I should do this). I already know how to do an external file (.js) and link to it from my .html page. Now I want the code to put in the .js file, and the code to put in the <body> of my .html file. Please help me Thanks I have 4 rows in a table. Each row consist of 4 radio buttons. Each radio button per row has different values in it but has the same name (group) ex: <input type="radio" name="a" value="1"> <input type="radio" name="a" value="2"> <input type="radio" name="a" value="3"> <input type="radio" name="a" value="4"> <input type="radio" name="b" value="1"> <input type="radio" name="b" value="2"> <input type="radio" name="b" value="3"> <input type="radio" name="b" value="4"> and so on.. If I click radio button A with value 2, I want to output the total at the bottom as "2".. Also, if I click radio button B with value 3, I want to output the total of A and B as 5 and so on.. How can I automatically calculate the answer based on which radio button was click? update: I got my answer from this site: http://stackoverflow.com/questions/1...s-using-jquery in my php page i have two text field i have to get the value by ajax/java script then by clickin radio button add or multy ply i have to show the result. how cain i do it?
Hello, I am currently learning JS and want to use the following to add a counter alongside the "Items Remaining" to countdown from 5 then once the max number has been reached my button to disappear and it say "finished". Can anyone help me please? Code: <!doctype html> <html> <head> <title>Adding Numbers Together</title> </head> <body> <form id = "frmOne"> <table border="1" > <tr> <th> Items Remaining </th> <td><Input Type="Text" Name="val" > </td> </tr> <tr> <th> Number One:</th> <th> Number Two:</th> </tr> <tr> <td> <Input Type="Text" Name="txtFirstNumber" Size="5" value=""> </td> <td> <Input Type="Text" Name="txtSecondNumber" Size="5" value=""> </td> </tr> <tr> <td colspan="2"> Totals: <textarea Name="totals" style="width: 400px; height: 300px;"></textarea></td> </tr> <tr> <td colspan="2"> <Input Type="Button" Name="b1" Value="Add Numbers" onClick = calculate()> </td> </tr> </table> </form> <script> var Totals = [ ]; function calculate() { var form = document.getElementById("frmOne"); var A = form.txtFirstNumber.value; var B = form.txtSecondNumber.value; Totals.push( A + " + " + B + " = " + (1*A+1*B) ); form.totals.value = Totals.join("\n"); form.txtFirstNumber.value = form.txtSecondNumber.value = ""; } </script> </body> </html> hey guys. got acouple questions for my website. im more of a html guy.. and i usually find my scripts online. i reeaaallly appreciate all answers! i have a box: <img id="imgSearch" src="" alt="Websites" /> <input type="button" value="Toggle Search" id="btnSearch" /> ^being the button to toggle between websites. basically i'd like this button to toggle between different websites when clicked. secondly: changing span tag colors html code: Traffic Light: <span id="trafficLight"></span> <input type="button" value="Prevent Accident" id="btnTraffic" /> i'd like to change the color of this span id by pressing the button. so in this case it would change red, yellow green and last: changing the font in a bold tag bold by pressing a button html code: (note, the font weight in normal in css for bold) <b>i want this bold when you hit the button!</b> <input type="button" value="Set Bold" id="btnBold" /> Hi all Is there a way to get the image(s) to load into the table after the page has loaded instead of the way I have it now? I have 4 tabs, but I would like the imgs in tabs 2,3,4 to load after page load. Example of how the tabs look. Code: <div class="tabbertab"> <h2>Australia_____</h2> <table width="100%" border="0" cellpadding="3" cellspacing="1" bgcolor="#FFFFCC"> <caption class="highlight_Red">澳洲 Australia </caption> <tr> <td><a href="pages/promotion.html#aus_ACE" rel="nofollow" target="_blank"><img src="pages/images/Pics/AUS/ace.jpg" alt="ACE / ATTC" width="110" height="69" border="0" align="left" class="ozimg_L"/> ...a few more images etc the other tabs look the same. LT Hi-- I have a link that has an mp3 sound as its href: Code: <a href="sounds/genealogy.mp3" class="track track-default">this is a link</a> Unfortunately, I also need that same link to go to a part on the site (href=#greenhouse) so that the sound plays on that part of the site. Does anyone know how to accomplish this? I am imagining it would be with javascript, but honestly, I do not know. Any help would be greatly appreciated. Many thanks...! |