JavaScript - Please Help - Simple Script That Won't Work!
I am a very novice web coder and can't get this to work... I've tried everything and am getting no where but frustrated! Thanks in advance!!
Code: <html> <head> <SCRIPT LANGUAGE="JavaScript"> <!-- Begin function calculateSavings() { var lastBill = eval(document.theForm.elements[0].value); var frequencyRating = eval(document.theForm.elements[1].value); var savingsRate = .05; var annualSavings = 0; /* if (frequencyRating == 'every day) { savingsRate = .01; } else if (frequencyRating == 'weekly) { savingsRate = .05; } else if (frequencyRating == 'monthly') { savingsRate = .15; } else if (frequencyRating == 'yearly') { savingsRate = .2; } */ annualSavings = lastBill * savingsRate; document.write(annualSavings); } // End --> </SCRIPT> </head> <body> <form name="savingsCalcForm"> How much was your last bill? <br><INPUT TYPE="text"> <br> <br> How often are you using your tractor? <br><input type="radio" name="group1" value="every day"> every day<br> <input type="radio" name="group1" value="weekly "> weekly<br> <input type="radio" name="group1" value="monthly"> monthly<br> <input type="radio" name="group1" value="yearly"> yearly<br> <br> <br> <INPUT TYPE="button" VALUE="calculate savings" onClick="calculateSavings();"> </form> </body> </html> Similar TutorialsRight now, it only works with IE. This goes in the header... Quote: <script language="JavaScript1.2"> function makevisible(cur,which){ strength=(which==0)? 1 : 0.2 if (cur.style.MozOpacity) cur.style.MozOpacity=strength else if (cur.filters) cur.filters.alpha.opacity=strength*100 } </script> and this goes in the image: Quote: <img style="filter:alpha(opacity=20);-moz-opacity:0.2" onMouseover="makevisible(this,0)" onMouseout="makevisible(this,1)" src="SOURCE OF IMAGE"> It works great in IE, but not firefox or chrome. Any way I can alter this to get it to work in all 3 or at least Firefox and IE. Thanks for the help! Hi All, I have two scripts which I want to try and integrate. I am using a nice gallery script to show thumbnails which are appended to a an image wrapper which on click of the thumbnail shows the larger image in the image wrapper, I am trying to implement cloud zoom which is a plugin which uses image srcs to then point to an anchor href to show another larger zoom image either in the same place.. which is what I am trying to do or in another div beside. I have had to set me img srcs up in a certain way to easily enter some product details. and I need to try an manipulate the code to make it work to suit my file layout. I am using a var= images [ with a series of file locations and info such as below { src: 'romanticabride/thumbs/tn_Shauna.jpg', srcBig: 'romanticabride/images/Shauna.jpg', title: 'Shauna', longDescription: '<b><H1>Shauna</H1></b><br><b>Romantica Of Devon <br><br><h2>Sizes Available:</h2><br> 6 - 32.<b><br><b><br><b><b><b><H2>Colours Available:</h2><b><br>Various<br>Please Enquire Below<br><br><br><br><a href="mailto:tracy@cherishbridal.co.uk?subject=Web Enquiry Regarding Romantica Shauna Bridal Gown"class="enquiry rose glow" >Click To Enquire About This Item </a>' }, what I need is for cloud zoom to work when the main image wrapper is hovered over which means it will need to add a class or when the whichever srcBig: is hovered over it gets wrapped by href to make the script work . one of my pages is http://www.cherishbridal.co.uk/romaticabride.html the cloud zoom script is at http://www.professorcloud.com/mainsite/cloud-zoom.htm.. I am happy to share a jsfiddle with someone or explain further or post some code. Thank you in advance Hello all, I made a fade script that will fade any element in or out. Works great on all browser I've tested but IE 7. With IE I have only tested this will IE 8 and IE 7. IE 7 the effect doesn't work. No error message or anything. I'm unsure what to do from here. I was hoping I could find some help here. Code: function fade(obj, duration, toggle) { steps = 1000; elem = document.getElementById(obj); function fadeIn() { for(var i = 0; i <= 1; i+=(1/steps)) { setTimeout("elem.style.opacity = "+ i +"", i * duration); setTimeout("elem.style.filter='alpha(opacity="+ i * 102 +")'", i * duration); } } function fadeOut() { for(var i = 0; i <= 1; i+=(1/steps)) { setTimeout("elem.style.opacity = "+ (1-i) +"", i * duration); setTimeout("elem.style.filter='alpha(opacity="+ (1-i) * 102 +")'", i * duration); } } /* One for Fade in and anything will be fade out*/ if(toggle == 1) { fadeIn(); } else { fadeOut(); } } Thanks, Jon W I need to assign a key in the javascript to actually make the javascript work,. I have a bookmark in chrome , a javascript , which actually works when clicked on it .,. but how can i edit it so that i can actually make it work on click a key or combination of keys. i want to declare the key or keycombo in the script itself .,. the script is for catching the selected text on the webpage and opening a new tab(or window) and doing an exact search search of the selected text using google.com .,., So I want it to work it this way ., select the text press a key and it opens a new tab (or window) with an xact search .,. i want to declare the key or keycombo in the script itself .,. the script is for catching the selected text on the webpage and opening a new tab(or window) and doing an exact search search of the selected text using google.com .,., So I want it to work it this way ., select the text press a key and it opens a new tab (or window) with an xact search .,. Thanks in advance ., Nani Hi, I am wanting to install an automatic re-direction script. I have seen some pretty complicated ones and then I came across this: Code: <script type="text/javascript"> <!-- if (screen.width <= 699) { document.location = "mobile.html"; } //--> </script> Is that going to work ? Thanks . I made a 50th anniversary guestbook to add memories/etc about our organization. The people can look at the entries and then if they want to add one of there own, there's a link that should pop up a form in a new for them to add it. I have no idea why this pop is not working in Internet Explorer (both IE6 and 7). It works beautifully in Firefox. I have no idea how you can go wrong with window.open. I'm stuck. Again, only the actual pop up function doesn't work. Everything else seems to be working fine. I included all of my code though even for the tab navigation because the link to the pop up form changes based on what tab they are in (i.e. if they're looking at the past memories tab and click on the link, it takes them to the past memories form). I know it's probably TMI on the code, but I thought it might be somehow related and better safe than sorry, right? HTML Page Code: <html> <head> <title>50th Anniversary Reflections</title> <script type="text/javascript" src="js/guestbook.js"></script> <link href="css/guestbook.css" media="all" type="text/css" rel="stylesheet"> </head> <body> <div id="guestbook_container"> <div id="tab_nav_container"> <ul> <li><div id="tab_1" class="tabs_on" onclick="tabsClass.switchTab(this);"><a target="gstbk_frame" href="guestbook_query.asp?cat=1" onclick="change_value(1);">Past Memories</a></div></li> <li><div id="tab_2" class="tabs_off" onclick="tabsClass.switchTab(this);"><a target="gstbk_frame" href="guestbook_query.asp?cat=2" onclick="change_value(2);">Career Impact</a></div></li> <li><div id="tab_3" class="tabs_off" onclick="tabsClass.switchTab(this);"><a target="gstbk_frame" href="guestbook_query.asp?cat=3" onclick="change_value(3);">Future Wishes</a></div></li> <li><div id="new" class="tabs_off" onclick="popupform();">Share Your Memories</div></li> </ul> </div><!-- end tab_nav_container --> <div id="tab_content_container"> <div id="tab_1_data" class="tab_content"><p class="tab_category">What is your most important memory of NACUA?</p></div> <div id="tab_2_data" class="tab_content" style="display: none;"><p class="tab_category">How has NACUA benefitted you and your career?</p></div> <div id="tab_3_data" class="tab_content" style="display: none;"><p class="tab_category">What is your most important wish or hope for NACUA's future?</p></div> </div><!-- end tab_content_container --> <script type="text/javascript"> tabsClass.addTabs("tab_nav_container"); </script> <br class="clear" /> <div id="iframe_container"> <iframe name="gstbk_frame" id="gstbk_frame" src="guestbook_query.asp?cat=1" width="730px" height="550px" scrolling="auto" frameborder="none"></iframe> </div><!-- end iframe_container --> <br class="clear" /> </div><!-- end guestbook_container --> </body> </html> Here's the guestbook.js file: Code: //***** ASSIGN/CHANGE CATEGORY VALUES ***** function popupform(){ var href; href="guestbook_submission_form.asp?cat="+catValue; window.open(href, "Submission Form", 'width=600, height=400, scrollbars=no'); } var catValue = "1" function change_value(catChange){ catValue=catChange; change_text(); } function change_text(){ if(catValue=="1"){ document.getElementById("new").innerHTML = "<a href='#' style='color:#ffffff;'>Share Your Memories!</a>"; } if(catValue=="2"){ document.getElementById("new").innerHTML = "<a href='#' style='color:#ffffff;'>Share Your Career Experiences!</a>"; } if(catValue=="3"){ document.getElementById("new").innerHTML = "<a href='#' style='color:#ffffff;'>Add Your Own Wish!</a>"; } } //***** ASSIGN/CHANGE VALUES AND TABS ***** function assignCategory(cat){ document.form.category.value=cat; } function onLoadAssignAndSwitch(cat){ assignCategory(cat); tabsClass.addTabs("tab_nav_container"); var initialTab = "tab_" + cat + "_data" if (initialTab != "tab_1_data"){ document.getElementById(initialTab).style.display = ""; document.getElementById("tab_1_data").style.display = "none"; } document.getElementById("tab_" + cat).className = "tabs_on"; } function assignAndSwitch(element, cat){ tabsClass.switchTab(element); assignCategory(cat); } //***** TABBED MENU ***** var tabsClass = { tabSetArray: new Array(), classOn: "tabs_on", classOff: "tabs_off", addTabs: function (tabsContainer) { tabs = document.getElementById(tabsContainer).getElementsByTagName("div"); for (x in tabs) { if (typeof(tabs[x].id) != "undefined") { this.tabSetArray.push(tabs[x].id); } else {} } }, switchTab: function (element) { for (x in this.tabSetArray) { tabItem = this.tabSetArray[x]; dataElement = document.getElementById(tabItem + "_data"); if (dataElement) { if (dataElement.style.display != "none") { dataElement.style.display = "none"; } else {} } else {} tabElement = document.getElementById(tabItem); if (tabElement) { if (tabElement.className != this.classOff) { tabElement.className = this.classOff; } else {} } else {} } document.getElementById(element.id + "_data").style.display = ""; element.className = this.classOn; } }; I'm not that advanced in javascript (although not a total idiot) Any help and/or suggestions would be greatly appreciated! Thank you! I have the following script in the head; Code: <script type="text/javascript"> <![CDATA[ <!--This function validates the data from the three input boxes on the MAILTO form--> function validate() { Check="Valid"; Name=document.contact.name.value; Mail=document.contact.mail.value; Comment=document.contact.comment.value; if (Name=="your name" || Name.length<1) { alert("Please enter your name"); Check="Invalid"; } else if (Mail.indexOf("@")<1 || Mail.indexOf(".")<1) { alert("Please enter a valid email address"); Check="Invalid"; } else if (Comment=="your comment" || Comment.length<1) { alert("Please enter your comment"); Check="Invalid"; } if (Check=="Invalid") { return false; } else { alert("Thank you for your comment"); } } ]]> </script> and the following form in the body; Code: <div> <form name="contact" onsubmit="return validate()" action="email.asp" method="post"> <div class="input_title">Name:</div><input type="text" name="name" size="25" class="input_box" /> <br /> <div class="input_title">Your Email:</div><input type="text" name="sender" size="25" class="input_box" /> <br /> <div class="input_title">Phone Number:</div><input type="text" name="tel" size="25" class="input_box" />(Optional) <br /> Message: <br /> <textarea name="enquiry" cols="50" rows="6" class="input_box"></textarea> <br /> <input type="submit" value="Submit" name="submit" /><input type="reset" value="Reset" name="reset" /> <br /> </form> <br /><br /> </div> It is a aspx file and validates fine as XHTML Trans. Why won't it work? Okay I'm trying to make a script where if I click on a link a div pops up. And if I click on another link another div pop ups up and the old div is closed. The script calls the function from the link in the html and sends an ID. I am confused as to why this doesn't work. Code: function controls(vtiles){/*ID of requested div*/ vtiles.style.ClassName='switchOn'; //change it's classname to something that's displayed var cap=document.getElementsByTagName('div');// get every div element for(i=0;i<cap.length;i++) // make some kina loop with the number of divs { var store=cap[i].ClassName; if(store=='switchOn' && cap.[i].id); { /*look for div's that are on (switchOn) and check to see if they have and ID*/ var check = cap.[i].id //store their IDs if(check!=vtiles){//check to see if the id is the one stored in Vtiles store=='switchP'//change the classname to switchP(off) } } } } Code: <div class="content"><a class="Atiles" href="#" onclick="controls(document.getElementById('Ankara'))">Ankara</a></div> <div id="Ankara" class="switchP"> Code: .switchP{ position:absolute; display:none; z-index:-1; left: 20px; top:40px; } .switchOn{ position:absolute; display:block; z-index:100; left: 20px; top:40px; width:200px; height:200px; } hey I'm a bit confused, I really am looking for some javascript tutorials so I don't have to keep asking for help. I have a validate script for my form. It is jquery. On the form I have added $#contact_form .validate(); but I think that maybe this is not going to work, should it be: jquery/javascript/jquery.validate.pack.js as this is the link for it. I know little js Code: <script src="../javascript/jquery.validate.pack.js" type="text/javascript"></script> <link href="../styles/mainstyle.css" rel="stylesheet" type="text/css" /> <link href="../styles/navigation.css" rel="stylesheet" type="text/css" /> <link href="../styles/layout.css" rel="stylesheet" type="text/css" /> <link href="http://fonts.googleapis.com/css?family=Cabin|Ubuntu" rel="stylesheet" type="text/css" /> <link href="../styles/form.css" rel="stylesheet" type="text/css" /> <script type="text/javascript"> $(document).ready(function(){ $("#contactform").validate(); }); </script> I have 3 HTML form inputs fields that is dynamically generated by a "add more" button, with naming for the fields name as fieldName, fieldName1, fieldName2, fieldName3, and so on. Now, I'm trying to retrieve the value from this fields with JavaScript, using the script below. var bookingForm = document.forms['formName']; var qty = bookingForm.fieldName +'i'.value; with the 'i' been a generated numeric number by a for loop when I use alert(qty), it returns NaN, when I'm expecting the value for fieldName1, fieldName2, and so on. But when I use; var qty = bookingForm.fieldName.value I can get the value in that field but get NaN when I try to concatenate 1,2,3, with the fieldName. Any help will be very much appreciated. Hello! I have the following code that I just can't seem to get to work. Here are the issue that aren't working: 1. The items that are stored in the users account aren't showing up as selected when you enter the page. (They work in IE, not Chrome) 2. When you click the items, nothing happens. (It used to work and would add the item to the top image) If you need any more info, or more of the code, let me know. I removed most of the PHP to simplify it for revising, and I didn't include it's CSS. Code: <div id="avatar_form" width="95" height="141"> </div> <div id="avatar_stack"> <p> <img src="hs/news/Upload/images/blankx.png" alt="" /><input name="avatar[Extras]" type="radio" value="blank" <? if($prof[base]==blank) echo("checked='checked'");?> /> </p> <p> <img src="hs/news/Upload/images/skin1.gif" alt="" /><input name="avatar[Skin Tone]" type="radio" value="body1" <? if($prof[skin]==body1) echo('checked="checked"');?> <? if($prof[skin]==blank) echo("checked='checked'");?> /> </p> <p> <img src="hs/news/Upload/images/blankx.png" alt="" /><input name="avatar[Hair]" type="radio" value="blank" <? if($prof[hair]==blank) echo("checked='checked'");?> /> </p> <p> <img src="hs/news/Upload/images/girlface.gif" alt="" /><input name="avatar[Face]" type="radio" value="girlface" <? if($prof[face]==girlface) echo("checked='checked'");?> /> </p> <p> <img src="hs/news/Upload/images/blankx.png" alt="" /><input name="avatar[Hand Item]" type="radio" value="blank" <? if($prof[handitem]==blank) echo("checked='checked'");?> /> </p> <p> <img src="hs/news/Upload/images/shirt6.gif" alt="" /><input name="avatar[Shirt]" type="radio" value="shirt6" <? if($prof[shirt]==shirt6) echo("checked='checked'");?> /> </p> <p> <img src="hs/news/Upload/images/blankx.png" alt="" /><input name="avatar[Hat]" type="radio" value="blank" <? if($prof[hat]==blank) echo("checked='checked'");?> /> </p> <p> <img src="hs/news/Upload/images/pants7.gif" alt="" /><input name="avatar[Pants]" type="radio" value="pants7" <? if($prof[pants]==pants7) echo("checked='checked'");?> /> </p> <p> <img src="hs/news/Upload/images/blankx.png" alt="" /><input name="avatar[Shoes]" type="radio" value="blank" <? if($prof[shoes]==blank) echo("checked='checked' checked");?> /> </p> <p> <img src="hs/news/Upload/images/blankx.png" alt="" /><input name="avatar[Accessories]" type="radio" value="blank" <? if($prof[accessory]==blank) echo("checked='checked' checked");?> /> </p> <p> <img src="hs/news/Upload/images/blankx.png" alt="" /><input name="avatar[Costume]" type="radio" value="blank" <? if($prof[costume]==blank) echo("checked='checked' checked");?> /> </p> </div> <BR><BR><BR> <script type="text/javascript"> var avatar_layers = new Array('Extras', 'Skin Tone', 'Hair', 'Face', 'Hand Item', 'Shirt', 'Hat', 'Pants', 'Shoes', 'Accessories', 'Costume') var layer_colours = new Array('#fff', '#fff', '#fff', '#fff', '#fff', '#fff', '#fff', '#fff', '#fff', '#fff', '#fff') var inactive_tab_background_colour = '#fff' var inactive_tab_bottom_border_colour = '#fff' var stack_height = 1 var on_top = 0 var key = null onload = layout function layout() { if(!document.getElementById('avatar_section')) return document.onkeydown = keyhit tabs() hide_radio_buttons(document.getElementById('avatar_stack')) StackImageHolders('avatar_stack'); P = document.getElementById('avatar_stack').getElementsByTagName('p')[on_top] P.style.backgroundColor = layer_colours[on_top] P.style.zIndex = stack_height++ LIs = document.getElementById('avatar_section').getElementsByTagName('li') for(i=0; i<LIs.length; i++) { LIs[i].style.backgroundColor = inactive_tab_background_colour LIs[i].style.borderBottomColor = inactive_tab_bottom_border_colour } LIs[on_top].style.backgroundColor = layer_colours[on_top] LIs[on_top].style.borderBottomColor = layer_colours[on_top] LIs[on_top].focus() IMGs = document.getElementById('avatar_stack').getElementsByTagName('img') for(i=0; i<IMGs.length; i++) { IMGs[i].className = 'black_border' IMGs[i].style.cursor = 'pointer' IMGs[i].onclick=function(){ChangeGarment(this)} } avatar_preview_and_hotkey_text() update_avatar(document.getElementById('avatar_stack').firstChild) /* I added the following two lines because Internet Explorer wasn't updating the display properly after loading */ document.getElementsByTagName('body')[0].style.width='95'; document.getElementsByTagName('body')[0].style.width='95'; } function keyhit(e) { thisKey = e ? e.which : window.event.keyCode alt_key_down = e ? e.altKey : window.event.altKey ctrl_key_down = e ? e.ctrlKey : window.event.ctrlKey shift_key_down = e ? e.shiftKey : window.event.shiftKey switch (thisKey) { case 37: key = 'LEFT' break case 39: key = 'RIGHT' break default: key = null } if(key && alt_key_down && ctrl_key_down) { IMGs = document.getElementById('avatar_stack').getElementsByTagName('p')[on_top].getElementsByTagName('img') for(i=0; i<IMGs.length; i++) { if(IMGs[i].className == 'red_border') { if((key == 'LEFT') && (i > 0)) { i-- ChangeGarment(IMGs[i]) return } if((key == 'RIGHT') && (i < (IMGs.length - 1))) { i++ ChangeGarment(IMGs[i]) return } } } } else if(key && alt_key_down && shift_key_down) { LIs = document.getElementById('avatar_section').getElementsByTagName('li') if((key == 'LEFT') && (on_top > 0)) { on_top-- bring_to_the_top(LIs[on_top]) return } if((key == 'RIGHT') && (on_top < (LIs.length - 1))) { on_top++ bring_to_the_top(LIs[on_top]) return } } } function tabs() { list = document.createElement('ul') for(i=0; i<avatar_layers.length; i++) { list_item = document.createElement('li') list_item.appendChild(document.createTextNode(avatar_layers[i])) list_item.onmouseover=function(){this.className='mouse'} list_item.onmouseout=function(){this.className=''} list_item.tab_number=i;//faux attributes to "stick" the indexes i and j values list_item.onclick=function(){ bring_to_the_top(this) } list_item.onfocus=function(){ bring_to_the_top(this) } list.appendChild(list_item) } document.getElementById('avatar_section').insertBefore(list, document.getElementById('avatar_stack')) } function hide_radio_buttons(caller) { INPUTs = caller.getElementsByTagName('input') for(i=0; i<INPUTs.length; i++) { if(INPUTs[i].type == 'radio') { INPUTs[i].style.display = 'none'; } } } function StackImageHolders(caller) { Ps = document.getElementById(caller).getElementsByTagName('p') for(i=0; i<Ps.length; i++) { Ps[i].className = 'stack' } } function avatar_preview_and_hotkey_text() { for(i=0; i<avatar_layers.length; i++) { preview = document.createElement('img') preview.id = avatar_layers[i] preview.className = 'preview' preview.width = '95px' preview.height = '141px' preview.alt = 'avatar preview image' document.getElementById('avatar_stack').appendChild(preview) } hotkey_text = document.createElement(' ') hotkey_text.className = 'hotkeys' hotkey_text.appendChild(document.createTextNode('')) document.getElementById('avatar_stack').appendChild(hotkey_text) } function update_avatar(caller) { INPUTs = caller.parentNode.getElementsByTagName('input') for(i=0; i<INPUTs.length; i++) { if(INPUTs[i].type == 'radio') { if(INPUTs[i].checked) { document.getElementById(INPUTs[i].name.match(/^.*[(.*)]$/)[1]).src='hs/news/Upload/images/' + INPUTs[i].value + '.gif' INPUTs[i].previousSibling.className = 'red_border' } else { INPUTs[i].previousSibling.className = 'black_border' } } } } function ChangeGarment(caller) { inputs = caller.parentNode.getElementsByTagName('input') for(i=0;i<inputs.length;i++) { inputs[i].checked=false } caller.nextSibling.checked=true update_avatar(caller) } function bring_to_the_top(caller) { tabs = document.getElementById('avatar_section').getElementsByTagName('li') for(i=0; i<tabs.length; i++) { tabs[i].style.backgroundColor = inactive_tab_background_colour tabs[i].style.borderBottomColor = inactive_tab_bottom_border_colour } on_top = caller.tab_number caller.style.backgroundColor = layer_colours[caller.tab_number] caller.style.borderBottomColor = layer_colours[caller.tab_number] put_on_top = document.getElementById('avatar_stack').getElementsByTagName('p')[caller.tab_number] put_on_top.style.zIndex = stack_height++ put_on_top.style.backgroundColor = layer_colours[caller.tab_number] } </script> hello... script doesn't work.. it does work in IE but not in another browser like mozilla,opera & safari? what should I do?.. Code: //Current HTML of page var html=""; //View of the page, Normal (Design), HTML, Preview var currentview=0; //Hold window objects for the color, table and properties dialogs var table_dialog, color_dialog, properties_dialog; //Current color action, ForeColor, or BackColor, //used for communication between PageCreate window and Color dialog window var pp; //Is used to disable use of design tools in HTML or Preview mode var enabletoolbar=false; //Variable counter used to index the search in the document var n=0; function InitEditor(){ //Init editor in design mode, maineditor.document.designMode=docmode; //Write a blank page WriteDefaultPage(); //Disable context menu maineditor.document.oncontextmenu=new Function("return false;"); //Set focus to the editor maineditor.focus(); } function EditorView(view){ //Changes editor view to Normal, HTML, and Preview if(currentview==1){ //If the last view was HTML then get the HTML edited by user in HTML mode html=maineditor.document.body.innerText; } //If the last mode was Normal then get the whole HTML content of the page else html=maineditor.document.all.tags("HTML")[0].outerHTML; if(view==0){ //Normal Mode EnableToolbar(true); maineditor.location="about:blank"; maineditor.document.designMode=docmode; maineditor.document.open("text/html"); maineditor.document.write(html); maineditor.document.close(); maineditor.document.oncontextmenu=new Function("return false;"); maineditor.focus(); } if(view==1){ //HTML Mode EnableToolbar(false); maineditor.location="about:blank"; maineditor.document.designMode=docmode; WriteDefaultPage(); HTMLView(); maineditor.document.oncontextmenu=new Function("return false;"); } if(view==2){ //Preview Mode EnableToolbar(false); maineditor.location="about:blank"; //Disable page editing maineditor.document.designMode="Inherit"; //Write the HTML of the page maineditor.document.open("text/html"); maineditor.document.write(html); maineditor.document.close(); //Enable context menu maineditor.document.oncontextmenu=new Function("return true;"); } //Set current view currentview=view; } function EnableToolbar(enable){ //Enable or disable toolbar enabletoolbar=enable; } function OpenFile(){ if(window.confirm("Do you want to save changes in the current document?")){ //Show Save As Dialog maineditor.document.execCommand("SaveAs"); } fileopen_dialog.style.visibility="visible"; } function OpenSelectedFile(){ //Check if the file is an HTML page if(document.fileselect.thefile.value.indexOf(".htm")==-1){ window.alert("The selected file is not an HTML page, please select a valid HTML file"); return; } //Hide the open file dialog fileopen_dialog.style.visibility="hidden"; //Create the FSO object var fso=new ActiveXObject("Scripting.FileSystemObject"); //Open the selected file var f=fso.OpenTextFile(document.fileselect.thefile.value); //Get the content of the file var thehtml=f.ReadAll(); //Close the file f.close(); //Write a blank page maineditor.window.location="about:blank"; //Write the HTML content maineditor.document.open("text/html"); maineditor.document.write(thehtml); maineditor.document.close(); //Set focus to editor maineditor.focus(); } function WriteDefaultPage(){ //Writes a blank HTML page in the editor var pagehtml="<html>\n<head>\n<meta http-equiv=\"Content-Type\" content=\"text/html; " + "charset=windows-1252\">\n<meta name=\"GENERATOR\" content=\"PageCreate\">\n" + "<title>New Page</title>\n</head>\n<body>\n</body>\n</html>"; maineditor.document.open("text/html"); maineditor.document.write(pagehtml); maineditor.document.close(); } function NewPage(){ if(window.confirm("Do you want to save changes in the current document?")){ //Show Save As Dialog maineditor.document.execCommand("SaveAs"); } //Write a blank page maineditor.window.location="about:blank"; WriteDefaultPage(); //Set focus to editor maineditor.focus(); } function HTMLView(){ //Switch to HTML view maineditor.document.body.innerHTML=""; maineditor.document.body.innerText=html; } function TableOn(table, on){ //Highlights the table on which the mouse is over if(on) table.style.backgroundColor="#95AFFF"; else table.style.backgroundColor="#82DF82"; } function ToolbarOn(toolon){ //Highlights on or off the current toolbar //Get the toolbar button on which the mouse is over var tool=event.srcElement; //Change background color if(toolon){ tool.style.backgroundColor="#B4A0FE"; tool.style.borderColor="#000000"; } else{ tool.style.backgroundColor="#D1D1D1"; tool.style.borderColor="#D1D1D1"; } } function FindInPage(showdialog){ //Shows the Find and Replace Dialog var display="visible"; if(showdialog==false) display="hidden"; find_dialog.style.visibility=display; if(showdialog!=false) document.find.findwhat.focus(); } function FindIt(str, replacestr, newstr){ //This functions searchs for a string in the document //and if specified then replaces it with a new string if(str==""){ //If no string to search entered alert("Enter a string to search"); document.find.findwhat.focus(); return; } //Creates a range in the document txt = maineditor.document.body.createTextRange(); //Loop to find the string in the document for (i = 0; i <= n && (found = txt.findText(str)) != false; i++) { txt.moveStart("character", 1); txt.moveEnd("textedit"); } if(found) { //If founded select it and scroll into view txt.moveStart("character", -1); txt.findText(str); //If replace is specified then replace the match with the new string if(replacestr) txt.text=newstr; txt.select(); txt.scrollIntoView(); n++; } else { if (n > 0) { window.alert("There are no more matches"); n=0; } // Not found anywhere, give message. else window.alert("\"" + str + "\" was not founded in document"); } } function InsertHTML(newhtml){ //Inserts HTML in the selection of the document maineditor.focus(); var selpoint=maineditor.document.selection.createRange(); selpoint.pasteHTML(newhtml); } function GetSelectedText(){ //Get the selection of the document maineditor.focus(); var selpoint=maineditor.document.selection.createRange(); var seltext=selpoint.text; return seltext; } function InsertNewImage(){ if(enabletoolbar==false) return; maineditor.focus(); //Open Insert Image Dialog maineditor.document.execCommand("insertimage", true, null); } function InsertForm(){ //Creates a new form var formmethod=window.prompt("Choose form method: GET | POST", "POST"); var formaction=window.prompt("Choose form action:", "http://"); InsertHTML("<div style=\"background-Color:#C0C0C0\"><form method=\"" + formmethod + "\" action=\"" + formaction + "\">\n<p> </p></form></div>"); } function InsertFormControl(control){ maineditor.focus(); //Inserts a form control maineditor.document.execCommand(control, true, null); } function CreateNewLink(){ //Inserts a link in the selected text if(enabletoolbar==false) return; var linktext=GetSelectedText(); if(linktext=="") return; var url=window.prompt("Enter a URL for the new link:", "http://"); if(url!=null){ InsertHTML("<a href=\"" + url + "\">" + linktext + "</a>"); } maineditor.focus(); } function InsertTable(){ //Open Table Dialog table_dialog=window.open("table.htm", "newtable", "top=100,left=100,height=300,width=400,scrollbars=no"); } function CreateTable(tr, tc, ta, tb, tp, ts, tw, tt){ //Creates a new table var tablewidth=""; if(tw!=""){ tablewidth=" width=\"" + tw + tt + "\""; } var thtml="<table border=\"" + tb + "\" cellpadding=\"" + tp + "\" cellspacing=\"" + ts + "\"" + tablewidth + ">"; tr=parseInt(tr); tc=parseInt(tc); for(r=0;r<tr;r++){ thtml+="<tr>"; for(c=0;c<tc;c++){ thtml+="<td></td>"; } thtml+="</tr>"; } thtml+="</table>"; InsertHTML(thtml); table_dialog.close(); } function EditPage(){ properties_dialog=window.open("properties.htm", "editpage", "top=100,left=100,height=275,width=387,scrollbars=no"); } function EditPageProperties(pt, pfc, pbgc, pbgi, usewatermark, pbgs){ maineditor.document.title=pt; maineditor.document.body.text=pfc; maineditor.document.body.bgColor=pbgc; maineditor.document.body.background=pbgi; if(usewatermark) maineditor.document.body.bgProperties="fixed"; else maineditor.document.body.bgProperties=""; if(pbgs!=""){ var pagehtml=maineditor.document.all.tags("HTML")[0].outerHTML; var bodytag= pagehtml.toLowerCase().indexOf("<body"); if(bodytag==-1) return; var beforebodytag= pagehtml.substring(0, bodytag); var afterbodytag= pagehtml.substring(bodytag, pagehtml.length); var pagehtml=beforebodytag + "<bgsound src=\"" + pbgs + "\">" + afterbodytag; maineditor.document.open("text/html"); maineditor.document.write(pagehtml); maineditor.document.close(); } properties_dialog.close(); maineditor.focus(); } function ChangeForeColor(){ //Show the Color dialog to edit Fore Color of text selected if(GetSelectedText()!=""){ pp="EditForeColor"; color_dialog=window.open("color.htm", "colorpicker", "top=100,left=100,height=270,width=500,scrollbars=no"); } } function EditForeColor(thecolor){ maineditor.focus(); //Change fore color of text selected maineditor.document.execCommand("forecolor", false, thecolor); //Close Color Dialog color_dialog.close(); } function ChangeBackColor(){ //Show the Color dialog to edit Back Color of text selected if(GetSelectedText()!=""){ pp="EditBackColor"; color_dialog=window.open("color.htm?p=EditBackColor", "colorpicker", "top=100,left=100,height=270,width=500,scrollbars=no"); } } function EditBackColor(thecolor){ maineditor.focus(); //Change back color of text selected maineditor.document.execCommand("backcolor", false, thecolor); //Close Color Dialog color_dialog.close(); } function ChangeFont(font){ //Changes the font of the selected text maineditor.focus(); maineditor.document.execCommand("fontname", false, font); } function ChangeFontSize(size){ //Changes the font size of the selected text maineditor.focus(); maineditor.document.execCommand("fontsize", false, size); } function DesignTools(tool){ //Activates design tool if(enabletoolbar==false){ window.alert("You must switch into normal view to do this"); return; } maineditor.focus(); maineditor.document.execCommand(tool, true, null); } Please help. This works fine in IE but will not work in FireFox: <iframe name="ad" id="rotator" src="about:blank" scrolling="no" framespacing="0" frameborder="0" marginwidth="0" marginheight="0" border="0" style="width:450px; height:300px"></iframe> <script language="JavaScript" type="text/javascript"><!-- // Pages to rotate var pages=new Array('http://www.newquaynet.com/rotating_pages/page1.htm', 'http://www.newquaynet.com/rotating_pages/page2.htm', 'http://www.newquaynet.com/rotating_pages/page3.htm'); // Rotation interval, in miliseconds (1000 = 1 second) var rint=15000; var currentpage=-1; function rotator(){ currentpage++; if(currentpage >= pages.length){ currentpage=0; } document.all.rotate.src=pages[currentpage]; setTimeout('rotator()', rint); } rotator(); //--></script> Problem solved, thanks for looking.
Hi, I need a very simple script that will do the following : I have a HTML form. I have an input call "title". Say I wrote "fleur-de-lys" I have a text area call "text" When I hit the submit button I want to do : 1. Create a HTML webpage with the name in input : fleur-de-lys.html 2. Add the text in "text" somewhere in the body of that new file fleur-de-lys.html 3. Add a preview of that text somewhere in my index page Basically it's like you post a new article on wordpress or whatever, but I just want something simple no database and just need help on how I do this. Thank you very much ok i am trying to make a countdown timer from 20 seconds when i click start where am i going wrong with this Code: <html> <head> </head> <body> <script type="text/javascript"> function timer() { var milisec=0 var seconds=20 document.counter.d2.value=20 function display() { if (milisec<=0){ milisec=9 seconds-=1 } if (seconds<=-1){ milisec=0 seconds+=1 } else milisec-=1 document.counter.d2.value=seconds+"."+milisec setTimeout("display()",100) display() }} </script> <form name="counter"> <center> Text Timer<br> <input type="text" size="30" name="d2"> <br> <input type="button" onclick="timer()" value="click me to start"> </center> </form> </body> </html> Hi everyone, I am a first time poster but have been reading your forum for some time. I think I am following all the rules but be gentle if I missed something! I recently inherited a website at work and have been tasked with sprucing it up. We have a photo directory page for all employees. The page takes a directory of jpegs and creates one long page with all the names and pictures of all the employees. The problem is the page only works in IE compatibility mode. It does not work in IE (non-compatibility), Firefox, or Chrome. When the page is not in IE compatibility mode, all that loads is the top of the page that says "CONFIDENTIAL" but none of the pictures load. There is a "progress bar" that has been coded in (it doesn't really accurately reflect the progress of all the pictures loading... again I didn't make this but am now stuck with it) which doesn't work unless in compatibility mode either. I am sure there must be something simple in the code that has since been deprecated or something like that, but I have been looking at it for days and can't seem to figure out what it is. The page was made a long time ago by someone who doesn't work here anymore, but I can't just get rid of it because according to our click tracks, it is one of the most viewed pages on the site. Code: <SCRIPT LANGUAGE="JavaScript"> var duration=10 // Specify duration of progress bar in seconds var _progressWidth = 50; // Display width of progress bar. var _progressBar = "|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||" var _progressEnd = 5; var _progressAt = 0; // Create and display the progress dialog. // end: The number of steps to completion function ProgressCreate(end) { // Initialize state variables _progressEnd = end; _progressAt = 0; // Move layer to center of window to show if (document.all) { // Internet Explorer progress.className = 'show'; progress.style.left = (document.body.clientWidth/4) - (progress.offsetWidth/4); progress.style.top = document.body.scrollTop+(document.body.clientHeight/8) - (progress.offsetHeight/8); } ProgressUpdate(); // Initialize bar } // Hide the progress layer function ProgressDestroy() { // Move off screen to hide if (document.all) { // Internet Explorer progress.className = 'hide'; } else if (document.layers) { // Netscape document.progress.visibility = false; } else if (document.getElementById) { // Netscape 6+ document.getElementById("progress").className = 'hide'; } } // Increment the progress dialog one step function ProgressStepIt() { _progressAt++; if(_progressAt > _progressEnd) _progressAt = _progressAt % _progressEnd; ProgressUpdate(); } // Update the progress dialog with the current state function ProgressUpdate() { var n = (_progressWidth / _progressEnd) * _progressAt; if (document.all) { // Internet Explorer var bar = dialog.bar; } else if (document.layers) { // Netscape var bar = document.layers["progress"].document.forms["dialog"].bar; n = n * 0.55; // characters are larger } else if (document.getElementById){ var bar=document.getElementById("bar") } var temp = _progressBar.substring(0, n); bar.value = temp; } // Demonstrate a use of the progress dialog. function ProgressBar() { ProgressCreate(10); window.setTimeout("Click()", 100); } function Click() { if(_progressAt >= _progressEnd) { ProgressDestroy(); return; } ProgressStepIt(); window.setTimeout("Click()", (duration-1)*1000/10); } function CallJS(jsStr) { //v2.0 return eval(jsStr) } </script> <SCRIPT LANGUAGE="JavaScript"> // Create layer for progress dialog document.write("<span id=\"progress\" class=\"hide\">"); document.write("<FORM name=dialog id=dialog>"); document.write("<TABLE border=1 bgcolor=\"RED\">"); document.write("<TR><TD ALIGN=\"center\">"); document.write("Loading Page ... Please Wait ...<BR>"); document.write("<input type=text name=\"bar\" id=\"bar\" size=\"" + _progressWidth/2 + "\""); if(document.all||document.getElementById) // Microsoft, NS6 document.write(" bar.style=\"color:navy;\">"); else // Netscape document.write(">"); document.write("</TD></TR>"); document.write("</TABLE>"); document.write("</FORM>"); document.write("</span>"); ProgressDestroy(); // Hides </script> There is more to the page but I have tried to narrow it down to the parts I feel are relevant. Any help would be greatly appreciated. Ben Reply With Quote 01-23-2015, 09:38 PM #2 felgall View Profile View Forum Posts Visit Homepage Master Coder Join Date Sep 2005 Location Sydney, Australia Posts 6,745 Thanks 0 Thanked 666 Times in 655 Posts That is a really antiquated script - basically written for Internet Explorer 4 and Netscape 4. If you want it to work properly with modern browsers then the code needs a significant rewrite. You should start by getting rid of all of the document.all document.layers and document.write references I'm a real novice and out of my depth with this, i hope someone can help. I have a small script that searches a single page for a keyword, it works fine with IE, but will not work with Firefox. Below is the code thats checks which browser is running and the action to take. Code: var NS4 = (document.layers); var IE4 = (document.all); var win = window; var n = 0; function findInPage(str) { var txt, i, found; if (str == "") return false; if (NS4) { if (!win.find(str)) while(win.find(str, false, true)) n++; else n++; if (n == 0) alert("Not found."); } if (IE4) { txt = win.document.body.createTextRange(); for (i = 0; i <= n && (found = txt.findText(str)) != false; i++) { txt.moveStart("character", 1); txt.moveEnd("textedit"); } Can anyone help me out with this problem. Many thanks Jasper Trying to have my navigation have an on click and selected state, but I am not able to do so with this code (website is: http://bit.ly/rgwsite ) Code: $('nav li a').click(function() { $(this).parent().addClass('on').siblings().removeClass('on'); }); nav li is as follows Code: <nav> <li class="highlt"> <a href="index.php" class="home"><span>Home</span></a> </li> The reason we need to use a jquery/javascript action to add the class to the navigation is because it doesn't refresh when a new page loads. For instance, when you're on the home page and click on the tab "Experience RGW", it only loads the content for that page below the header (within the "#ajax" div). Currently, none of these scripts are working. There is no reason they shouldn't... could there be something else causing the page not to recognize the jquery script and run it on-click? The main reason I ask is because I've tried to test the function and add an alert, but even that didn't work |