JavaScript - Addeventlistener Not Passing Function Variable Correctly
Every time i click on one of the said elements, it puts "undefined" into the textbox each time i click on an element.
it seems to me that the Key_Table[x] is not getting passed correctly. How do i make sure that this is getting passed correctly? Here's my Code: Code: <script type='text/javascript'> // Startup Script if (document.addEventListener) { document.addEventListener("DOMContentLoaded", LoadEventListeners, false); } function LoadEventListeners() { var Key_Table = ["q", "w", "e", "r", "t", "y", "u", "i", "o", "p"]; // Create event Listeners for the alphabetic keys for(var x = 0; x < Key_Table.length; x++) { Key_Table[x] = document.getElementById(Key_Table[x]); Key_Table[x].addEventListener("click", function(){ InsertChar(Key_Table[x]); }, false); } } function InsertChar(Char) { alert("Char is:" + Char); // Textbox data document.getElementById('TextData').value = document.getElementById('TextData').value + Char; } </script> Similar TutorialsThank you in advance if someone can help. I have been banging my head against the wall for hours now. Here is the code: Code: for (var i = 0; i < BS_crm['activityTypes'].length; i++) { var clickFunc = function(){ activityList.showForm( -1, {blockType:[""+BS_crm['activityTypes'][i]['id'], "0"]} ); }; var type = { value: BS_crm['activityTypes'][i]['id'], label: "Add New "+BS_crm['activityTypes'][i]['label'], css: BS_crm['activityTypes'][i]['css']+"_16", onClick: clickFunc }; previewLinks.items.push( type ); } Now, basically what I am doing here is running through one array to create an array of objects, that will be used to create links that will use whatever onClick function I pass it. The problem is that on the second line I need the BS_crm['activityTypes'][i]['id'] to be a value, not a reference. If that line was simply changed to: Code: var clickFunc = function(){ activityList.showForm( -1, {blockType:["3", "0"]} ); }; then everything would work as I need. How can I make this happen? I would really appreciate any help. Thank you again in advance. Hi, I am having trouble passing the correct id to change the innerHTML. I have a jsp that display people and their address information. There could be several people in the list, so it is in a loop. That part all works good. There is a drop down list with countries in them. Based on the country they select, I want to change some of the text. Here is what I have: Code: <tr> <td class="datashaded" valign="top"><font size="2"><b>Country:</b></font></td> <td class="datashaded" valign="top"> <select tabindex="<%=countryTab%>" name="<%=country%>" size=1" onChange="changeText(this.form.<%=country%>, this.form.<%=addressLabel%>, this.form.<%=zipLabel%>);"> <% for (int i =0; i < countryList.size(); i++ ) { String countryOption = (String)countryList.get(i); String countryVal = bene.getAddress().getCountry(); String selected = ""; if ( countryOption.equalsIgnoreCase( countryVal ) ) selected = "selected"; %> <option value="<%=countryOption %>" <%=selected%> ><%=countryOption%></option> <% } %> </select> </td> </tr> <tr> <td class="datashaded"><div id="addr1"><font size=2><b id="<%=addressLabel%>">Address:</b></font></div></td> <td class="datashaded"> <input size=20 maxlength="50" tabindex="<%=add1Tab%>" name="<%=address1%>" value="<%=address1Value%>" </td> </tr> Everytime through the loop, addressLabel has an index added to it so it is unique - so I can refer to each person separately. Here is the js function: Code: function changeText(sel, txtField1, txtField2) { var selectedValue = sel[sel.selectedIndex].value; if ( selectedValue == "<%=IParticipantConstants.BENEFICIARY_COUNTRY %>") { document.getElementById(txtField1).innerHTML = 'Address:'; document.getElementById(txtField2).innerHTML = 'Zip:'; } else { document.getElementById(txtField1).innerHTML = 'Street or P.O. Box'; document.getElementById((txtField2).innerHTML = 'Postal Code:'; } } When I hardcoded the id= value, not matter which group I changed the country on, only the first one was changing, so I knew I needed unique ids for each group. There is more to the table, but this is the good part. When the onChange fires now, Nothing at all happens. Can anyone see the problem?? Thanks for looking! I have a function which is currently called twice on the same page. Part of the function is to apply an onkeyup event to a created element. The problem is that when the function is called twice the first created element calls the onkeyup function of the second element! table_JD.length-1 = 0 for first element table_JD.length-1 = 1 for second element updateSearch_TC_JD(1) is somehow called from first element! Code: newSearchBox.onkeyup = function() {updateSearch_TC_JD(table_JD.length-1)} Thanks for any help you can provide! Hi, I have a DOM click event that creates a <span>. When the user clicks a button, it turns that <span> into a textarea that the user can type a new name in, press enter, and then the span contains the text the user input. Sort of like when you rename a file in Windows Explorer. Anyway, the code is something like this, and I'm wondering if I can use 'area_el' in this way... right now it's giving me the error that area_el is undefined, even though I define it in the function that contains the Event declaration. The first part is the Dom stuff to make it all work. It's not stuff I need to mess with, but I'm putting it here in case it's useful. Code: var Dom = { get: function(el) { if (typeof el === 'string') return document.getElementById(el); else return el; }, add: function(el, dest) { var el = this.get(el); var dest = this.get(dest); dest.appendChild(el); }, remove: function(el) { var el = this.get(el); if(el.parentNode != null) el.parentNode.removeChild(el); } }; var Event = { add: function() { if (window.addEventListener) { return function(el, type, fn) { Dom.get(el).addEventListener(type, fn, false); }; } else if (window.attachEvent) { return function(el, type, fn) { var f = function() { fn.call(Dom.get(el), window.event); }; Dom.get(el).attachEvent('on' + type, f); }; } }() }; The following code defines what happens when the user clicks submit to create a polygon. I also have some variables: Code: var created_area_array = Array(); var createdarea_index = 0; var number_of_areas_saved=0; var currently_renaming=false; Event.add(window, 'load', function() { Event.add('SubmitArea', 'click', function() { if(polyPoints.length>0) add_created_area(); }); }); Finally, where the issue is. I define area_el in the function below, and further down I want to pass it to a function within the "rename" click event, but I get an error that area_el is undefined. Code: function add_created_area() { number_of_areas_saved++; var area_el = document.createElement('span'); var area_el_remove = document.createElement('span'); var area_el_rename = document.createElement('span'); var new_entry = polyPoints; var new_entry_array_index = "Area" + (createdarea_index); var new_entry_array_name = "Area #" + (createdarea_index+1); area_el.innerHTML = '<span class=\"address-text\">' + new_entry_array_name + '</span><br>'; area_el_remove.innerHTML = "<a onMouseOver=\"rollover('address_remove')\" onMouseOut=\"rollout('address_remove')\" style='cursor:pointer;'>" + "<img src=\"images/tabs-icons/normal-address_remove.png\" name='address_remove' title='remove' alt='remove'></a> "; area_el_rename.innerHTML = "<a onMouseOver=\"rollover('area_rename')\" onMouseOut=\"rollout('area_rename')\" style='cursor:pointer;'>" + "<img src=\"images/tabs-icons/normal-area_rename.png\" name='area_rename' title='rename' alt='rename'></a> "; created_area_array[new_entry_array_index] = new_entry; createdarea_index++; Dom.add(area_el_remove, 'CreatedAreas'); Dom.add(area_el_rename, 'CreatedAreas'); Dom.add(area_el, 'CreatedAreas'); Event.add(area_el, 'click', function(e) { if(!currently_renaming) { polyPoints = []; var thePolyPoints = (created_area_array[new_entry_array_index]).toString(); alert(thePolyPoints); //formatting created_area_array[new_entry_array_index] to store as polygon points in the polyPoints array thePolyPoints = thePolyPoints.replace(/[\[\]{}]/g, ""); thePolyPoints = thePolyPoints.replace(/Location/g, ""); //adding the co-ordinates to the polyPoints array thePolyPoints = thePolyPoints.split(","); for(var ctr=0; ctr+1<thePolyPoints.length; ctr+=2) { var location1 = new Microsoft.Maps.Location(thePolyPoints[ctr],thePolyPoints[ctr+1]); polyPoints.push(location1); } var out=""; for(var i=0; i<polyPoints.length; i++) { out += polyPoints[i] + " "; } alert(out); //creating the polygon and searching... if(create_area==true) { drawPolygon(); polygonSearch(); } else if(create_area==false) { document.getElementById('createarea').innerHTML = "<a id='createarea'><span class='create_area' style='color:blue'><strong>Create Area</strong></span></a>"; document.getElementById("mapDiv").oncontextmenu = function(){return false} MouseUpHandlerId = Microsoft.Maps.Events.addHandler(map, "mouseup",MouseUpHandler); MouseDownHandlerId = Microsoft.Maps.Events.addHandler(map, "mousedown",MouseDownHandler); MouseMoveHandlerId = Microsoft.Maps.Events.addHandler(map, "mousemove",MouseMoveHandler); MouseOverHandlerId = Microsoft.Maps.Events.addHandler(map, "mouseover",MouseOverHandler); drawPolygon(); polygonSearch(); create_area=true; } } }); Event.add(area_el_remove, 'click', function(e) { Dom.remove(this); Dom.remove(area_el_rename); Dom.remove(area_el); if(number_of_areas_saved>1) number_of_areas_saved--; }); Event.add(area_el_rename, 'click', function(e) { if(!currently_renaming) { area_el.innerHTML = '<textarea name=\"renaming_area\" id=\"renaming_area\" style=\"width:200px;height:10px;background-color:#DCDCDC; resize:none;font-size:8px;\" onKeyPress=\"return enter_rename(area_el, event)\" maxlength=\"30\"></textarea><br>'; currently_renaming=true; } }); Event.add("createdarea_clear", 'click', function(e) { Dom.remove(area_el_remove); Dom.remove(area_el_rename); Dom.remove(area_el); created_area_array = []; number_of_areas_saved=0; createdarea_index=0; }); } The enter_rename(area_el, event) function that isn't passing in my variable. Code: function enter_rename(area_el, event) { var keyPressed = (event.which) ? event.which : event.keyCode; var current_str = document.getElementById("renaming_area").value; if(keyPressed == 13) { if(current_str.length>0) { if(allSpaces(current_str)==true) { alert("Please enter a meaningful area name."); return false; } else { area_el.innerHTML = '<span class=\"address-text\">' + current_str + '</span><br>'; currently_renaming=false; return true; } } else return false; } else return true; } Making area_el global does not clear the span elements when I click my "createdarea_clear" button, however when it's local, the function works as expected. I'm trying to make it so when you click a cell in a table it runs a function based on the value within that cell. With the current code, no matter what cell is clicked, the alert box displays the same number, which is the last number in my array. The variable, princ, is just being overwritten rather than writing code to each the cell with the proper value. Help is appreciated. Thanks. Code: for(i=0;i<=3;i++){ document.writeln('<tr>'); document.writeln('<th>'+(periodArray[i])+'</th>'); for(j=0;j<=2;j++){ princ = principleArray[j][i]; document.writeln('<td onclick="(calculateInterest(princ,1,1))">$'+principleArray[j][i]+'</td>'); } document.writeln('</tr>'); } function calculateInterest(principle,rate,period){ totalInterest = principle * rate * period; totalLoanCost = principle + totalInterest; alert('Total Interest: '+totalInterest+'\n'+'Total Loan Cost: '+totalLoanCost); } This code is finally working, but for some reason no matter which button i click on, it is always returning "9". It should be firing the alert(x), where x is the x index value for that particular addEventListener Code: .addEventListener('click', function (e) {alert(x);}, Code: <html> <script type="text/javascript"> document.addEventListener('DOMContentLoaded', DOMLoadedEventFunction, false); function DOMLoadedEventFunction () { for(var x = 0; x < 9; x++) { document.getElementById('btn' + x).addEventListener('click', function (e) {alert(x);}, false); } } </script> <body> <input type="button" id="btn0" value="1"> <input type="button" id="btn1" value="2"> <input type="button" id="btn2" value="3"> <input type="button" id="btn3" value="4"> <input type="button" id="btn4" value="5"> <input type="button" id="btn5" value="6"> <input type="button" id="btn6" value="7"> <input type="button" id="btn7" value="8"> <input type="button" id="btn8" value="9"> <input type="button" id="btn9" value="10"> </body> </html> This is just some sample code that i will later turn into an HTML5 File Manager I'm a js noob but have managed to cobble together some code for a simple calculator. All the math works well, but changing the radio button doesn't have any effect. Basically, I have 4 set of equations (long if/then statements) - 2 are to be used when one radio button is checked, 2 if the other is checked. Code: <html><head> <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1"> <script language="JavaScript"> function temp(form) { var r1 = form.r1.value; var GNW = parseFloat(form.GNW.value, 10); var BNW = parseFloat(form.BNW.value, 10); var totalfee = 0; var netfee = 0; var discount = 0; //if the "old" radio button is selected, use the the next two if/then formulas if (r1=1) { for brevity sake, I'll omit the first two if/then equations Code: //close out the "old" options } //use the "new" option else if (r1=2) { // two more if/then statements } // this applies to all conditions discount = totalfee - netfee; form.totalfee.value = totalfee/4; form.netfee.value = netfee/4; form.discount.value = discount/4; } and now the radio buttons Code: <input name="r1" value=1 type="radio" checked="checked">Old (3m/3m) <input name="r1" value=2 type="radio" >Current (5m/5m)</p><p> hopefully the brevity makes the answer apparent, the full code is attached if I've left out a crucial detail. Hi, I am facing a problem in passing replace() function as an argument in user defined java function, can any one help me how to resolve it? intention is to pass a file path to my user defined function, but before passing the path i want to replace the character '\' to '\\' I am posting my javascript function he <a href="#" onclick="OpenDocPreview('<%# Eval("PATH")%>'.replace(/\\/g,"\\\\"), '<%# Eval("Filename")%>')"><%# Eval("DocTitle") %></a> function OpenDocPreview(url, docname) { alert('message from search base : ' + url + ' ' + docname); } thank you, Hi, Any one help me In one variable i have some data ex: var data = document.getElementById("imageId").value; I want to pass this data to another function inside another function ex: var button1 = '<img src="images/Remove-button.gif" width="70" height="15" onclick="removeVerifyImageRow(this),saveLibData('+data+')"/>'; while running the application i am getting an error incase if the data is string ex:if data is 'image1' i am getting an error, but with number there is no problem ex: if data is '1122'. this is very urgent to solve this problem plz any one help me Hi, I have a global variable that I change depending on what's going on in screen. <script> var closed=true; .... hideInfobox(pinInfobox); alert("closed: " + closed) //returns false in Chrome, true in FF </script> And that function changes that variable. function hideInfobox(pinInfobox) { if(pinInfobox != null) pinInfobox.setOptions({ visible: false }); alert("closed: " + closed) //returns false in Chrome, false in FF closed=true; alert("closed: " + closed) //returns false in Chrome, true in FF current_pid=null; } For some reason, in FF, it modifies the variable as expected. But in Chrome, it doesn't. Why is this? Is there any way to have consistent behaviour in both browsers? Thanks for reading! ~ kberry Edit: In fact: var closed=true; alert("closed: " + closed); returns true in FF, but false in Chrome... why....? *sigh* fixed it. my bad. Please delete this thread.
I think this is what I am trying to do, I am pretty new to javascript so I'm not sure... but here is my question... I got this function below. Code: function getProductInfo(id) { var sku = window.document.InvoiceForm.Item0Sku.value; alert(sku); } when I use the 0 I get the right value back, however whenever I try to pass it the id variable with a value of '0' I can't seem to compose the concatenation correct in order to recieve the correct value. I either recieve errors or the whole window.document.InvoiceForm.Item0Sku.value string back in the alert, what am I doing wrong? I'm trying to pass the following variables.
Code: var hours; var mins; in the below code, however I can't get the value but keep getting values don;t exist. here is all the code 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>Classic Example</title> <script type = "text/javascript"> var totalhrs = (2* 3600); var totalmin = (180* 60); var totaltime = (totalhrs + totalmin); var timeInSecs; var ticker; var p = true; function pauseTimer() { if (p) {p=false} else { p = true; tick(); } } function startTimer(secs){ timeInSecs = parseInt(secs); ticker = setInterval("tick()",1000); } function tick() { var secs = timeInSecs; if (p) { if (secs>0) { timeInSecs--; } else { document.getElementById("but1").disabled = false; clearInterval(ticker); // stop counting at zero } } var hours= Math.floor(secs/3600); secs %= 3600; var mins = Math.floor(secs/60); secs %= 60; var result = ((hours < 10 ) ? "0" : "" ) + hours + ":" + ( (mins < 10) ? "0" : "" ) + mins + ":" + ( (secs < 10) ? "0" : "" ) + secs; document.getElementById("countdown").innerHTML = result; } </script> </head> <body onload="startTimer(totaltime);"> <script type="text/javascript"> document.write('<a href="another_page.php?mins='+mins+'&hrs='+hours+'">test link</a>'); </script> <p><span id="countdown" style="font-weight: bold;"></span></p> </body> </html> I'm trying to capture the 2 noted variables above in the simple link, Code: <script type="text/javascript"> document.write('<a href="another_page.php?mins='+mins+'&hrs='+hours+'">test link</a>'); </script> I read that you don't allow homework assignments to be posted, but this is only one small section of the assignment (1 page of 5), and I have a migraine, and I am utterly hopeless and lost (ha)... I was wondering if there was any errors you could point out to me that would explain why the button isn't doing ANYTHING (i.e. not calculating the sum, average, or grade) when i click it. I'm new to js so I'm sure it could be pretty much any n00b error in the function code. But like I said any help would be greatly appreciated... Code: <?xml version="1.0" encoding="utf-8"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> <head> <link href="5A.css" rel="stylesheet" type="text/css" media="screen"/> <script type="text/javascript"> function DisplayGrades() { var aNum= 1* document.getElementById("txtaNum").value; var bNum= 1* document.getElementById("txtbNum").value; var Avg = (aNum+bNum)/2; document.getElementById("txtAvg").value=Avg; var Sum= aNum+bNum; document.getElementById("txtSum").value=Sum; var alphaGr= document.getElementbyID("txtalphaGr").value=alphaGr; if (Avg <= 60) alphaGr="F"; if (Avg>60 && Avg <= 70) alphaGr="D"; if (Avg>70 && Avg <= 80) alphaGr="C"; if (Avg>80 && Avg <=90) alphaGr="B"; if (Avg>90 && Avg <=100) alphaGr="A";} </script> </head> <body> <div id="wrapper"> <div id="interact"> Enter your grade for Test 1: <input type="text" id=txtaNum" class="controls" size="10" /> <br /> Enter your grade for Test 2: <input type="text" id=txtbNum" class="controls" size="10" /> <br /> <input type="button" id="btnDisplayGrades" value="Display Grades" onclick="DisplayGrades();" /> <hr/> Sum of Your Grades: <input type="text" id="txtSum" class="controls" size="10" readonly="readonly" /> <br/> Average Grade: <input type="text" id="textAvg" class="controls" size="10" readonly="readonly" /> <br /> Alpha Grade: <input type="text" id="txtalphaGr" class="controls" size="10" readonly="readonly" /> </div> </div> </body> </html> Hi, I wonder if someone can help! I am not a JavaScript programmer at all, so I cant really see what I am doing wrong with the following code... Just to explain I have 2 fields on a form that retrieve monetary data from a mysql database. The data is a monetary value e.g. 12.59. Which works fine as normal. I have been asked to hide this value depending on what the customers preferences are set to i.e Show Price = Yes or Show Price = No. Hopefully that makes sense. After lots of deliberation I realised that I couldnt hide the fields because the database called an error saying the price data was missing. So I thought change the field type to a 'password field' and the price data would still be accepted by the database. This thankfully worked and didnt break the php code. So I found some javascript code, chopped and pasted it and came up with the following script. This is called with an onclick event through a link. <script language="JavaScript"> function changetype(){ var myTextField = document.getElementById('hf_showmobprices'); if(myTextField.value == "Yes") document.getElementById('price1jd').type='password'; document.getElementById('price2jd').type='password'; else return false; } I thought the above would work but it doesn't. If I take out one of the lines "document.getElementById('price2jd').type='password';", then it does work. After more playing around I thought, create a function caller as shown below but again that doesnt work. The first function works but the second function doesnt seem to work. I shoved in an alert just to check that the second function was being called and it is. So what I gather is It seems to convert the first price field to a password type field but not the second field. Does anyone know why? is it some thing to do with the getElement and can only run once? I am using FireFox 3.6 if that will help <script type="text/javascript"> function checkprefs() { price1(); price2(); } </script> <script language="JavaScript"> function price1(){ var myTextField = document.getElementById('hf_showmobprices'); if(myTextField.value == "Yes") document.getElementById('price1jd').type='password'; else return true; } </script> <script language="JavaScript"> function price2(){ var mynewtestField2 = document.getElementById('hf_showmobprices'); if(mynewtestField2.value == "Yes") document.getElementById('price2jd').type='password'; else alert("alert2") } </script> Any guidance would be much appreciated john I've been staring at this same problem for over a week now. I've worked around it as best as i can but i think it's time to ask someone else for input. I'm trying to pass a value thru an ajax parameter.. that's all. it SHOULD be easy in theory. what i want to do is create a jscript variable then pass that variable as the value for a parameter. php then converts that value to something it can use to finish the rest of my code. As i said it's hindering my webpage progress and i would like to get it fixxed soon so any help would be appreciated. Code: function getSelection() { var selection=document.getElementsById("SelectedItem"); var xmlhttp;//create a var for the obj if (window.XMLHttpRequest)//if requesting an obj... { // code for IE7+, Firefox, Chrome, Opera, Safari xmlhttp=new XMLHttpRequest(); } else if (window.ActiveXObject) { // code for IE6, IE5 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } else { alert("Your browser does not support XMLHTTP!"); } xmlhttp.onreadystatechange=function() { if(xmlhttp.readyState==4) { var text = xmlhttp.responseText; addNode(text); } } xmlhttp.open("GET","battle_nin.php?selection",true); xmlhttp.send(null); } //the php snippet $currentjutsu=$_GET[selection]; google is not my friend on this one if I wanted to set a variable with radio buttons to decide whether a function adds or subtracts, I know I can't do this: Code: <body> <input type="radio" name ="op" onclick="op='-'">count up: <input type="radio" name ="op" onclick="op='+'"> <script type="text/javascript"> var op; function calc() { start=start op 1000; } </script> </body> but is there something I can do, without getting all if/elsey? Hello Can i pass php Variable into javascript function like this example. PHP Code: <script type="text/javascript"> <!-- function confirmation() { var answer = confirm("are u sure?") if (answer){ window.location = "user.php?action=statusd&uid=".$row['id'].""; } else{ alert("Canceled") } } //--> </script> This ".$row['id']." will be an user id ... link PHP Code: <a href='#' onclick='confirmation(); return false;'>Go</font></a> Hi, I'm having one javascript function which will return the variable and I need to pass that variable to command button action.Please find the below code and let me know how I can achieve this. <script> function addEntry(entries) { var uploadedEntry = entries[0].entryId; alert("Uploaded Entry Details::::" + uploadedEntry ); } </script> <h:commandButton tabindex="1" image="../img/submit.gif" action="#{portfolioListing.uploadMediaEntry(uploadedEntry)}" Thanks, Anil Hey there, I'll explain what I'm trying to do. I have a back-to-top button on my website that will only appear after the user is 500px down the page. I'd like to be able to change that 500px value to whatever the users window height is. I have a code that retrieves the users window height and will echo it wherever I place the script on my page: Code: <script> var winW = 800, winH = 600; if (document.body && document.body.offsetWidth) { winW = document.body.offsetWidth; winH = document.body.offsetHeight; } if (document.compatMode=='CSS1Compat' && document.documentElement && document.documentElement.offsetWidth ) { winW = document.documentElement.offsetWidth; winH = document.documentElement.offsetHeight; } if (window.innerWidth && window.innerHeight) { winW = window.innerWidth; winH = window.innerHeight; } document.writeln(+winH); </script> I'll also post the script for the back-to-top button: Code: <script type="text/javascript" src='<?php bloginfo('template_url'); ?>/js/jquery.min.js'></script><script> $(document).ready(function(){ // hide #back-top first $("#back-top").hide(); // fade in #back-top $(function () { $(window).scroll(function () { if ($(this).scrollTop() > 500) { $('#back-top').fadeIn(); } else { $('#back-top').fadeOut(); } }); // scroll body to 0px on click $('#back-top a').click(function () { $('body,html').animate({ scrollTop: 0 }, 800); return false; }); }); }); </script> In that first code, it seems like the value +winH is what I need to use. The line document.writeln(+winH); merely prints the value as text on my page. Now in this second piece of code there's two numeric values. The second, 800, is the speed that the page scrolls back to the top. The first value, 500, is the value I want to replace. Can anyone guide me through how I might combine these two scripts to work together? |