JavaScript - Userscript Experiment On Resizing With Aspect Ratio
Im trying to get this script working on this game on Kongregate
Im experimenting on this I took some script which resizes the whole game to its maximizations and I thought it needs to keep aspect ratio anyway I tried to modify all I can but all I get are gaps and game gets aligned to left some reason I couldnt find out I based it on this http://userscripts.org/scripts/show/34214 so can you tell me what I am doing wrong to get those gaps and what I need to do to make game not get aligned to left Im working like zomg Similar Tutorialshello, ive been wondering about this possibility for a while. i havent been able to find an answer to it using google, but im not very knowledgable about javascript in the first place. what id like to do is make a webpage that has one frame (or div if its necessary) that resizes based on a percentage of the size of the user's window upon loading, but always keeps the same aspect ratio. to get more specific: i want that second frame (or div) to have a locked 4:3 ratio. can this be done? This is what I tried but alas, it does not work por que no? This is located on my main index file which if the result of z is greater than 1, I would have the user stay at this page as opposed to redirecting to the portrait design. I have optimized the website for mobile use so there is a reason of having two different pages, the wide screen has extra tools / other stuff that isn't shown on the portrait not because of size/responsive design but becasue I want it to be this way. Anyway... "What's the situation captain?" This is located above my <style> tag Code: <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script> <script language="JavaScript" type="text/javascript"> <script> function redirect() { var x = screen.width; var y = screen.height; var z = x/y; if (z<1) { window.location.replace("alternate destination"); }; else ( ){ // stay here }; }; </script> Reply With Quote 12-21-2014, 01:58 AM #2 Old Pedant View Profile View Forum Posts Supreme Master coder! Join Date Feb 2009 Posts 28,311 Thanks 82 Thanked 4,754 Times in 4,716 Posts You have extra semicolons in there. In general, don't put a semicolon directly after a right brace }; There are a couple of exceptions, but they don't apply here. What's the point in having the else?? I've cannibalised some code from the jQuery supersized plugin that scales images to full screen size while retaining aspect ratio. However, I seem to be getting it wrong, and my maths is... well, appalling. The problem is that while it's resizing correctly to fit the width OR the height, it's not fitting the width AND the height. That is: If I adjust the window height, the image scales to fit the height, but goes outside the window width. If I adjust the window width, the image scales to fit the width, but goes outside the window height. If I adjust both (dragging the window corner) it seems to favour fitting the width. I am currently using only landscape images. I don't know if that has a bearing. This may well just be a logic issue, but my brain is just turning to jelly when I look at my code below: Code: var image_ratio = options.image_dimensions.height / options.image_dimensions.width; var browser_ratio = browser_height / browser_width; if (browser_ratio > image_ratio){ var target_height = browser_height; var target_width = Math.floor(browser_height / image_ratio); } else { var target_width = browser_width; var target_height = Math.floor(browser_width * image_ratio); } The code above works out some new image dimensions and is called when the browser is resized. The options.image_dimensions.height and options.image_dimensions.width variables represent the original dimensions of the image, and browser_height and browser_width are calculated from the window size. How can I make it fit either landscape or portrait images to the smallest available dimension of the browser? hi guys, im haveing a bit of a problem with this script - its a ratio calculator. can you guys see whats the problem? Heres the java script eg. when you write 86708 kills and 53240 death the K/D calc should show this: 1,62 = 86 (-86) 1,64 = 389 1,70 = 3582 but it doesent???? heres the code guys : <HTML> <HEAD> <script type="text/javascript"> function find_ratio() { var x = document.getElementById("x1").value; var y = document.getElementById("y1").value; var gcd=calc(x,y); var r1=x/gcd; var r2=y/gcd; var ratio = r1 / r2; document.getElementById("res").value = ratio.toFixed(2); var death1 = r1 / r2; death1 = Math.floor(ratio * 100) / 100; document.getElementById("death1").value = death1.toFixed(2); var kill1 = r1 / r2; kill1 = Math.ceil(ratio * 100) / 100; document.getElementById("kill1").value = kill1.toFixed(2); var kill3 = r1 / r2; kill3 = Math.ceil(ratio * 10) / 10; document.getElementById("kill3").value = kill3.toFixed(2); var deathcalc = (death1 - 0.00401) * r2; var death2 = deathcalc - r1; document.getElementById("death2").value = death2.toFixed(0); var killcalc1 = (kill1 - 0.00401) * r2; var kill2 = killcalc1 - r1; document.getElementById("kill2").value = kill2.toFixed(0); var killcalc2 = (kill3 - 0.00401) * r2; var kill4 = killcalc2 - r1; document.getElementById("kill4").value = kill4.toFixed(0); } function calc(n1,n2) { var num1,num2; if(n1 < n2){ num1=n1; num2=n2; } else{ num1=n2; num2=n1; } var remain=num2%num1; while(remain>0){ num2=num1; num1=remain; remain=num2%num1; } return num1; } function isInteger(s,iid) { var i; s = s.toString(); for (i = 0; i < s.length; i++) { var c; if(s.charAt(i)==".") { } else { c = s.charAt(i); } if (isNaN(c)) { alert("Given value is not a number"); document.getElementById(iid).value=""; return false; } } return true; } </script> <style type="text/css"> .style1 { width: 90px; } .style2 { height: 55px; } #x1 { text-align: center; } #y1 { text-align: center; } </style> </HEAD> <BODY> <table cellspacing=0 cellpadding=2 style="border:1px solid green; width: 250px; height: 217px;" align=center> <tr><td class="style1">Kills:</td><td style="text-align: center"><input type="text" id="x1" onkeyup="isInteger(this.value,this.id);"></td></tr> <tr><td class="style1">Death:</td><td style="text-align: center"><input type="text" id="y1" onkeyup="isInteger(this.value,this.id);"></td></tr> <tr><td colspan=2 align=center class="style2"><input type="button" value="Lad magien flyde" onclick="find_ratio()"></td></tr> <tr><td class="style1">Ratio:</td><td style="text-align: center"><input type="text" readonly id="res" style="font-weight:bold; width: 65px; text-align: center;" size="6"> = <input type="text" readonly id="res2" style="font-weight:bold; width: 65px; text-align: center;" size="6"></td></tr> <tr><td class="style1">Deaths to:</td><td style="text-align: center"> <input type="text" readonly id="death1" style="font-weight:bold; width: 65px; text-align: center;" size="6"> = <input type="text" readonly id="death2" style="font-weight:bold; width: 65px; text-align: center;" size="6"></td></tr> <tr><td class="style1">Kills to:</td><td style="text-align: center"> <input type="text" readonly id="kill1" style="font-weight:bold; width: 65px; text-align: center;" size="6"> = <input type="text" readonly id="kill2" style="font-weight:bold; width: 65px; text-align: center;" size="6"></td></tr> <tr><td class="style1">Kills to:</td><td style="text-align: center"> <input type="text" readonly id="kill3" style="font-weight:bold; width: 65px; text-align: center;" size="6"> = <input type="text" readonly id="kill4" style="font-weight:bold; width: 65px; text-align: center;" size="6"></td></tr></table> </BODY> </HTML> I have a form which is used to calculate residential Floor Area Ratio (FAR). The form is structured into seven parts as follows: Part A: Maximum FAR and Floor Area: Part B: Gross Floor Area of the main floors of the main house: Part C: Gross Floor Area of the basement or cellar: Part D: Gross Floor Area of the attic: Part E. Gross Floor Area of all accessory structures except detached garages: (including cabanas, guest houses, caretaker's cottages, pool houses, sheds, barns, or other structures except a detached garage) Part F. Gross Floor Area of the garage: (not including basement garages) Part G: Total Floor Area: The Javascript involved in the calculations is as follows: [CODE] <SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript"> function checkAllInputFields(){ IsValidEntry(entireForm.A1.value) IsValidEntry(entireForm.A5.value) IsValidEntry(entireForm.A6.value) IsValidEntry(entireForm.A8.value) IsValidEntry(entireForm.A9.value) IsValidEntry(entireForm.B1.value) IsValidEntry(entireForm.B3.value) IsValidEntry(entireForm.B4.value) IsValidEntry(entireForm.B5.value) IsValidEntry(entireForm.C1.value) IsValidEntry(entireForm.C2.value) IsValidEntry(entireForm.C3.value) IsValidEntry(entireForm.D3.value) IsValidEntry(entireForm.D4.value) IsValidEntry(entireForm.D6.value) IsValidEntry(entireForm.D7.value) IsValidEntry(entireForm.D9.value) IsValidEntry(entireForm.D10.value) IsValidEntry(entireForm.D12.value) IsValidEntry(entireForm.D13.value) IsValidEntry(entireForm.D14.value) IsValidEntry(entireForm.D15.value) IsValidEntry(entireForm.E1.value) IsValidEntry(entireForm.F2.value) IsValidEntry(entireForm.F3.value) IsValidEntry(entireForm.F4.value) IsValidEntry(entireForm.F5.value) IsValidEntry(entireForm.F8.value) IsValidEntry(entireForm.F9.value) IsValidEntry(entireForm.F11.value) IsValidEntry(entireForm.F12.value) IsValidEntry(entireForm.F14.value) IsValidEntry(entireForm.F15.value) IsValidEntry(entireForm.F17.value) IsValidEntry(entireForm.F18.value) IsValidEntry(entireForm.F19.value) IsValidEntry(entireForm.F20.value) } function IsValidEntry(entry){ if(entry == "N/A to this property" || entry == "" || IsNumeric(entry)){ //do nothing } else{ alert(entry + " is not a number. Numbers must only contain digits and decimal points") } } function IsNumeric(sText){ var ValidChars = "0123456789."; var IsNumber=true; var Char; for (i = 0; i < sText.length && IsNumber == true; i++) { Char = sText.charAt(i); if (ValidChars.indexOf(Char) == -1) { IsNumber = false; } } return IsNumber; } //function which returns given number to 2 decimal places function roundTwo(x) { return (Math.round(x*Math.pow(10,2)))/Math.pow(10,2) } // function which returns given number to 4 decimal places function roundFour(x) { return (Math.round(x*Math.pow(10,4)))/Math.pow(10,4) } // function which calls calculation functions for all sections // this function is called whenever anything is changed on the form function calculateAll(){ checkAllInputFields() doZoneChange() doPartA() doPartB() doPartC() doPartD() doPartE() doPartF() doPartG() } //funtion that changes form according to zoning district function doZoneChange(){ if (entireForm.zone.value == "AA1"){ entireForm.A5.value = "N/A to this property" entireForm.A5.disabled = true entireForm.A6.value = "N/A to this property" entireForm.A6.disabled = true entireForm.A7.value = "---------------------" entireForm.A8.value = "N/A to this property" entireForm.A8.disabled = true entireForm.A9.value = "N/A to this property" entireForm.A9.disabled = true entireForm.A10.value = "---------------------" entireForm.A11.value = "---------------------" entireForm.A12.value = "---------------------" entireForm.A13.value = "---------------------" entireForm.A14.value = "N/A to this property" } else{ if (entireForm.A6.value == "N/A to this property"){ entireForm.A5.value = "" entireForm.A5.disabled = false entireForm.A6.value = "" entireForm.A6.disabled = false entireForm.A7.value = "" entireForm.A8.value = "" entireForm.A8.disabled = false entireForm.A9.value = "" entireForm.A9.disabled = false entireForm.A10.value = "" entireForm.A11.value = "" entireForm.A12.value = "" entireForm.A13.value = "" entireForm.A14.value = "" if (entireForm.zone.value == "A1"){ entireForm.A13.value = "1200" } else if (entireForm.zone.value == "A4" || entireForm.zone.value == "A5"){ entireForm.A13.value = "400" } else{ entireForm.A13.value = "700" } } else{ if (entireForm.zone.value == "A1"){ entireForm.A13.value = "1200" } else if (entireForm.zone.value == "A4" || entireForm.zone.value == "A5"){ entireForm.A13.value = "400" } else{ entireForm.A13.value = "700" } } } } function doPartA(){ // Calculates A2 var lotArea = entireForm.A1.value if(lotArea < 5000){ entireForm.A2.value = .43 } else if(lotArea < 10000){ entireForm.A2.value = (.43-(((lotArea-5000)/1000)*.016)) } else if(lotArea < 15000){ entireForm.A2.value = (.35-(((lotArea-10000)/1000)*.012)) } else if(lotArea < 30000){ entireForm.A2.value = (.29-(((lotArea-15000)/1000)*.006)) } else if(lotArea < 35000){ entireForm.A2.value = (.20-(((lotArea-30000)/1000)*.0045)) } else if(lotArea < 40000){ entireForm.A2.value = (.1775-(((lotArea-35000)/1000)*.003)) } else if(lotArea < 45000){ entireForm.A2.value = (.1625-(((lotArea-40000)/1000)*.002)) } else if(lotArea < 50000){ entireForm.A2.value = (.1525-(((lotArea-45000)/1000)*.0015)) } else if(lotArea < 76231){ entireForm.A2.value = .145 } else { entireForm.A2.value = 0 } entireForm.A2.value = roundFour(entireForm.A2.value) // Calculates A4 if(lotArea < 76231){ var maxFar = entireForm.A2.value entireForm.A4.value = (roundTwo(lotArea * maxFar)) } else{ entireForm.A4.value = 15000 } // Calculates A7 & A10 var RRightSetBack = entireForm.A5.value var PRightSetBack = entireForm.A6.value var RLeftSetBack = entireForm.A8.value var PLeftSetBack = entireForm.A9.value entireForm.A7.value = (PRightSetBack - RRightSetBack) if(entireForm.A7.value <= 0){ entireForm.A7.value = 0 } entireForm.A10.value = roundFour(PLeftSetBack - RLeftSetBack) if(entireForm.A10.value <= 0){ entireForm.A10.value = 0 } leftResult = entireForm.A10.value rightResult = entireForm.A7.value // Calculates A11 entireForm.A11.value = roundFour(Number(leftResult) + Number(rightResult)) // Calculates A12 entireForm.A12.value = roundFour(entireForm.A11.value * 100) // Calculates A14 if(entireForm.zone.value == "AA1"){ entireForm.A14.value = "0" } else{ var formA13 = entireForm.A13.value var formA12 = entireForm.A12.value if(Number(formA13) < Number(formA12)){ entireForm.A14.value = formA13 } else{ entireForm.A14.value = formA12 } } // Calculates A15 entireForm.A15.value = (Number(entireForm.A14.value) + Number(entireForm.A4.value)) } function doPartB(){ //------------------------------------- // Calculates B2 & B6 //-------------------------------------- var formB2 = (entireForm.B1.value * 2) var formB3 = entireForm.B3.value var formB4 = entireForm.B4.value var formB5 = entireForm.B5.value entireForm.B2.value = formB2 entireForm.B6.value = roundTwo(Number(formB2) + Number(formB3) + Number(formB4) + Number(formB5)) } var firstTimeThrough = 0 function doPartC(){ //------------------------------------- // Calculates C4 //-------------------------------------- var tallestPoint = entireForm.C1.value if( !(entireForm.C1.value == "") ){ firstTimeThrough = 1 } if ( (tallestPoint < 3) && (firstTimeThrough == 1) ){ entireForm.C2.value = "N/A to this property" entireForm.C2.disabled = true entireForm.C3.value = "N/A to this property" entireForm.C3.disabled = true entireForm.C4.value = "0" } else{ if (entireForm.C2.value == "N/A to this property"){ entireForm.C2.value = "" entireForm.C2.disabled = false entireForm.C3.value = "" entireForm.C3.disabled = false entireForm.C4.value = "" } else{ entireForm.C4.value = roundTwo(entireForm.C3.value * entireForm.C2.value) } } } function doPartD(){ if(entireForm.D1.value == "No" || entireForm.D2.value == "No"){ entireForm.D3.value = "N/A to this property" entireForm.D3.disabled = true entireForm.D4.value = "N/A to this property" entireForm.D4.disabled = true entireForm.D5.value = "---------------------" entireForm.D6.value = "N/A to this property" entireForm.D6.disabled = true entireForm.D7.value = "N/A to this property" entireForm.D7.disabled = true entireForm.D8.value = "---------------------" entireForm.D9.value = "N/A to this property" entireForm.D9.disabled = true entireForm.D10.value = "N/A to this property" entireForm.D10.disabled = true entireForm.D11.value = "---------------------" entireForm.D12.value = "N/A to this property" entireForm.D12.disabled = true entireForm.D13.value = "N/A to this property" entireForm.D13.disabled = true entireForm.D14.value = "N/A to this property" entireForm.D14.disabled = true entireForm.D15.value = "N/A to this property" entireForm.D15.disabled = true entireForm.D16.value = "0" } else if(entireForm.D3.value == "N/A to this property"){ entireForm.D3.value = "" entireForm.D3.disabled = false entireForm.D4.value = "" entireForm.D4.disabled = false entireForm.D5.value = "" entireForm.D6.value = "" entireForm.D6.disabled = false entireForm.D7.value = "" entireForm.D7.disabled = false entireForm.D8.value = "" entireForm.D9.value = "" entireForm.D9.disabled = false entireForm.D10.value = "" entireForm.D10.disabled = false entireForm.D11.value = "" entireForm.D12.value = "" entireForm.D12.disabled = false entireForm.D13.value = "" entireForm.D13.disabled = false entireForm.D14.value = "" entireForm.D14.disabled = false entireForm.D15.value = "" entireForm.D15.disabled = false entireForm.D16.value = "" } else{ //------------------------------------- // Calculates D5 //-------------------------------------- if(entireForm.D3.value == "0"){ entireForm.D4.value = "0" entireForm.D5.value = "0" } else{ entireForm.D5.value = roundFour((entireForm.D4.value / entireForm.D3.value)*100) } //------------------------------------- // Calculates D8 //-------------------------------------- if(entireForm.D6.value == "0"){ entireForm.D7.value = "0" entireForm.D8.value = "0" } else{ entireForm.D8.value = roundFour((entireForm.D7.value / entireForm.D6.value)*100) } //------------------------------------- // Calculates D11 //-------------------------------------- if(entireForm.D9.value == "0"){ entireForm.D10.value = "0" entireForm.D11.value = "0" } else{ entireForm.D11.value = roundFour((entireForm.D10.value / entireForm.D9.value)*100) } if(entireForm.D12.value == "0"){ entireForm.D13.value = "0" } if(entireForm.D4.value == ""){ entireForm.D5.value = "NMI" } if(entireForm.D7.value == ""){ entireForm.D8.value = "NMI" } if(entireForm.D10.value == ""){ entireForm.D11.value = "NMI" } //------------------------------------- // Calculates D16 //-------------------------------------- if(entireForm.D5.value < 30 && entireForm.D8.value < 30 && entireForm.D11.value < 30 && entireForm.D12.value >= 5 && entireForm.D13.value >= 5){ entireForm.D14.value = "N/A to this property" entireForm.D14.disabled = true entireForm.D15.value = "N/A to this property" entireForm.D15.disabled = true entireForm.D16.value = "N/A to this property" } else if (entireForm.D14.value == "N/A to this property"){ entireForm.D14.value = "" entireForm.D14.disabled = false entireForm.D15.value = "" entireForm.D15.disabled = false entireForm.D16.value = "" } if (!(entireForm.D14.value == "") && !(entireForm.D15.value == "") && !(entireForm.D15.value == "N/A to this property") && !(entireForm.D15.value == "N/A to this property")){ entireForm.D16.value = (entireForm.D14.value - entireForm.D15.value) } } } function doPartE(){ //------------------------------------- // Calculates E2 //-------------------------------------- entireForm.E2.value = entireForm.E1.value } function doPartF(){ if(entireForm.F0.value == "No"){ entireForm.F3.value = "0" entireForm.F3.disabled = true entireForm.F4.value = "0" entireForm.F4.disabled = true entireForm.F5.value = "0" entireForm.F5.disabled = true entireForm.F6.value = "No" entireForm.F6.disabled = true entireForm.F7.disabled = true } else if(entireForm.F0.value == "Yes" && entireForm.F3.value == "0"){ entireForm.F3.value = "" entireForm.F3.disabled = false entireForm.F4.value = "" entireForm.F4.disabled = false entireForm.F5.value = "" entireForm.F5.disabled = false entireForm.F6.value = "Yes" entireForm.F6.disabled = false entireForm.F7.disabled = false } if(entireForm.F1.value == "No"){ entireForm.F2.value = "0" entireForm.F2.disabled = true } else if(entireForm.F1.value == "Yes" && entireForm.F2.value == "0"){ entireForm.F2.value = "" entireForm.F2.disabled = false } if(entireForm.F6.value == "No" || entireForm.F7.value == "No"){ entireForm.F8.value = "N/A to this property" entireForm.F8.disabled = true entireForm.F9.value = "N/A to this property" entireForm.F9.disabled = true entireForm.F10.value = "---------------------" entireForm.F11.value = "N/A to this property" entireForm.F11.disabled = true entireForm.F12.value = "N/A to this property" entireForm.F12.disabled = true entireForm.F13.value = "---------------------" entireForm.F14.value = "N/A to this property" entireForm.F14.disabled = true entireForm.F15.value = "N/A to this property" entireForm.F15.disabled = true entireForm.F16.value = "---------------------" entireForm.F17.value = "N/A to this property" entireForm.F17.disabled = true entireForm.F18.value = "N/A to this property" entireForm.F18.disabled = true entireForm.F19.value = "N/A to this property" entireForm.F19.disabled = true entireForm.F20.value = "N/A to this property" entireForm.F20.disabled = true entireForm.F21.value = "0" } else if(entireForm.F8.value == "N/A to this property"){ entireForm.F8.value = "" entireForm.F8.disabled = false entireForm.F9.value = "" entireForm.F9.disabled = false entireForm.F10.value = "" entireForm.F11.value = "" entireForm.F11.disabled = false entireForm.F12.value = "" entireForm.F12.disabled = false entireForm.F13.value = "" entireForm.F14.value = "" entireForm.F14.disabled = false entireForm.F15.value = "" entireForm.F15.disabled = false entireForm.F16.value = "" entireForm.F17.value = "" entireForm.F17.disabled = false entireForm.F18.value = "" entireForm.F18.disabled = false entireForm.F19.value = "" entireForm.F19.disabled = false entireForm.F20.value = "" entireForm.F20.disabled = false entireForm.F21.value = "0" } else{ //------------------------------------- // Calculates F10 //-------------------------------------- if(entireForm.F8.value == "0"){ entireForm.F9.value = "0" entireForm.F10.value = "0" } else{ entireForm.F10.value = roundFour((entireForm.F9.value / entireForm.F8.value)*100) } //------------------------------------- // Calculates F13 //-------------------------------------- if(entireForm.F11.value == "0"){ entireForm.F12.value = "0" entireForm.F13.value = "0" } else{ entireForm.F13.value = roundFour((entireForm.F12.value / entireForm.F11.value)*100) } //------------------------------------- // Calculates F16 //-------------------------------------- if(entireForm.F14.value == "0"){ entireForm.F15.value = "0" entireForm.F16.value = "0" } else{ entireForm.F16.value = roundFour((entireForm.F15.value / entireForm.F14.value)*100) } if(entireForm.F17.value == "0"){ entireForm.F18.value = "0" } if(entireForm.F9.value == ""){ entireForm.F10.value = "NMI" } if(entireForm.F12.value == ""){ entireForm.F13.value = "NMI" } if(entireForm.F15.value == ""){ entireForm.F16.value = "NMI" } //------------------------------------- // Calculates F21 //-------------------------------------- if(entireForm.F10.value < 30 && entireForm.F13.value < 30 && entireForm.F16.value < 30 && entireForm.F17.value >= 5 && entireForm.F18.value >= 5){ entireForm.F19.value = "N/A to this property" entireForm.F19.disabled = true entireForm.F20.value = "N/A to this property" entireForm.F20.disabled = true entireForm.F21.value = "N/A to this property" } else if (entireForm.F19.value == "N/A to this property"){ entireForm.F19.value = "" entireForm.F19.disabled = false entireForm.F20.value = "" entireForm.F20.disabled = false entireForm.F21.value = "" } if (!(entireForm.F19.value == "") && !(entireForm.F20.value == "") && !(entireForm.F20.value == "N/A to this property") && !(entireForm.F20.value == "N/A to this property")){ entireForm.F21.value = roundTwo(entireForm.F19.value - entireForm.F20.value) } } //------------------------------------- // Calculates F23 //-------------------------------------- entireForm.F22.value = entireForm.A1.value if(entireForm.F22.value <= 10000){ entireForm.F23.value = 250 } else{ entireForm.F23.value = 400 } //------------------------------------- // Calculates F24 & F25 //-------------------------------------- entireForm.F24.value = roundFour(Number(entireForm.F2.value) + Number(entireForm.F3.value)) entireForm.F25.value = roundFour(entireForm.F24.value - entireForm.F23.value) //------------------------------------- // Calculates F26 //-------------------------------------- if(entireForm.F25.value < 0){ entireForm.F25.value = 0 } entireForm.F26.value = roundTwo(Number(entireForm.F4.value) + Number(entireForm.F5.value) + Number(entireForm.F21.value) + Number(entireForm.F25.value)) } function doPartG(){ //------------------------------------- // Calculates G1 & G2 //-------------------------------------- entireForm.G1.value = roundTwo(Number(entireForm.B6.value) + Number(entireForm.C4.value) + Number(entireForm.D16.value) + Number(entireForm.E2.value) + Number(entireForm.F26.value)) entireForm.G2.value = entireForm.A15.value //------------------------------------- // Calculates G4 & G5 //-------------------------------------- if (entireForm.G1.value > entireForm.G2.value){ entireForm.G3.value = "Yes" entireForm.G4.value = roundTwo(entireForm.G1.value - entireForm.G2.value) } else{ entireForm.G3.value = "No" entireForm.G4.value = "Not exceeded" } } </SCRIPT> [CODE] I have attached the html file as a .txt file for reference, and I have attached a .txt document including all the values I used for testing. Why is it showing NaN values? Any help would be greatly appreciated. Thank You. Ok, told you I'd be asking lots of questions ... Code: <div id="resizetest" style="width:200px;height:200px;border:2px solid blue"> <div style="background:#000033"> <a href="#" style="float:right;background:#ffffff" onclick='document.getElementById("resizetest").height="50";'>_</a> </div> This is a resize test </div> Why doesn't this resize? I've looked at examples, and I don't see what's wrong. Hi, Am making a user registration page and i want it to be smaller then my other pages and it should open in a new window, something like a popup window. How can i do this? Thanks Hello i would need a 1x1 pixel image for my flagcounter,ive been trying for months [IMG*]http://2.s07.flagcounter.com/count/DymW/bg=ffffff/txt=ffffff/border=ffffff/columns=1/maxflags=1/viewers=3/labels=0/[/IMG*] (the stars for the image not to appear) helllp
Hi, Ive written some code to try and resize a page dependant on the content oof an iframe. Code is as follows: Code: window.onload=sizeAdj(); function sizeAdj() { var elFrame = document.getElementById('theFrame'); var elTable = document.getElementById('tableGrab'); var elDivMain = document.getElementById('main'); var elDivWrapper = document.getElementById('wrapper'); var the_height = elFrame.contentWindow.document.body; elFrame.height = the_height; elTable.height = the_height + 90; elDivMain.height = the_height + 90; elDivWrapper.height = the_height + 465; } I originally thought that I would just be able to resize the iframe and the other elements would follow suit but as you can see Ive tried to resize the other encasing elements also. The code resizes partially in chrome but only to a certain point and not to the full height of the doc content. Help greatly appreciated - full source content attached. Rugby Glass.zip Thanks Sol I'm coding my new website, and to save bandwidth, i'm letting users link to their own avatars, so I want to resize any images over 150px wide so it doesn't mess up my layout - simple, right? Well, you'd think so, but I don't know any javascript, so i've scrapped this together with what little I know: Code: var obj=document.getElementsByTagName("img"); for(var i=0;i<obj.length;i++){ if(obj[i].className == "avatar") { if(getElementWidth(obj[i]) > 150) { obj[i].style.width = 150; } } } Can anyone help me fix that or code me a new one please? I need it to check all elements (well, images - but only images will be using it) for a width of over 150px, and, if it is - change it to 150px I know it's pretty simple but it's hurting my head! :P Thanks in advance -Alux Hi folks! Very, very new to Javascript and I'm having a problem. What I'm trying to do is create a page that uses an iframe to show the fullsized image, while using thumbnails at the bottom. I need the iframe to resize depending on the size of the image since some are landscape and others are portrait oriented. I found a script online that did it for the height of the picture so I tried to modify it to do both the width and the height and haven't had much luck. Here's the code, and I apologize in advance for my noob coding. Code: <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <title>Halloween 2009</title> <script language="JavaScript"> <!-- function calcWidth() { //find the width of the internal page var the_width= document.getElementById('preview').contentWindow. document.body.scrollWidth; //change the width of the iframe document.getElementById('preview').width= the_width; } function calcHeight() { //find the height of the internal page var the_height= document.getElementById('preview').contentWindow. document.body.scrollHeight; //change the height of the iframe document.getElementById('preview').height= the_height; } //--> </script> <style type="text/css"> body {background: url(background/bg3.gif); text-align:center} img {height: 5em; width:5em; display: inline; border: none} </style> </head> <body> <div style="height: 448px"> <iframe src="Halloween '09 021.jpg" name="preview" id="preview" onLoad="calcWidth();calcHeight();" marginheight="0" marginwidth="0" scrolling="no"> An iframe capable browser is required to view this web site. </iframe> </div> <div id="thumbnails" style="padding-top: 1.5em; width: 40em; text-align: center"> <a href="Ariana.JPG" target="preview"><img src="Ariana.JPG" alt="" /></a> <a href="Halloween '09 002.jpg" target="preview"><img src="Halloween '09 002.jpg" alt="" /></a> <a href="Ayesha.jpg" target="preview"><img src="Ayesha.jpg" alt="" /></a> ETC... </div> </body> </html> Im using the below javascript to resize images on a forum I have created but I want it to ignore 2 certain images that are part of my header. Heres the code Code: <script> window.onload = resizeimg; function resizeimg() { if (document.getElementsByTagName) { for (i=0; i<document.getElementsByTagName('img').length; i++) { im = document.getElementsByTagName('img')[i]; if (im.width > 600) { im.style.width = '600px'; eval("pop" + String(i) + " = new Function(\"pop = window.open('" + im.src + "','phpbbegypt ','fullscale','width=400,height=400,scrollbars=1,resizable=1'); pop.focus();\")"); eval("im.onclick = pop" + String(i) + ";"); if (document.all) im.style.cursor = 'hand'; if (!document.all) im.style.cursor = 'pointer'; im.title = 'Click Here To See Image Full Size '; } } } } </script> But I want it to ignore 2 images..and not resize them. head1.jpg head2.jpg Any help would be gratefully recieved !! Cheers !! Hi there, I just recently took over a site that has some java code on it I'm unfamiliar with. If you go to smalltowngossipmusic.com, you'll see what this code does. Go to the pages "Sounds" or "Travel", and once your mouse leaves the main image at the top of the page, you should see those pages shrink. This is some code that was implemented on the site (which is wordpress) in the header.php template. Here is the code: Code: <script type="text/javascript"> /* <![CDATA[ */ var $ = jQuery.noConflict(); $(document).ready(function () { headerImage(); }); var speed = 500; var origMT = 0, origHeight = '120px'; function expandHeader(obj) { $('.headerImage').animate({height: '436px'},speed); $('.headerImage img').animate({'margin-top': '-2px'},speed); } function shrinkHeader(obj) { $('.headerImage').stop().animate({'height': origHeight},speed); $('.headerImage img').stop().animate({'margin-top': origMT},speed); } function headerImage() { origMT = $('.headerImage img').css('margin-top'); origHeight = $('.headerImage').css('height'); $('.headerImage img').css('margin-top','0'); $('.headerImage').css('height','436px'); setTimeout(shrinkHeader,speed*2); $('.headerImage').hover(expandHeader, shrinkHeader); } /* ]]> */ </script> If you look at the page source for each page, you'll see that there is nothing out of whack (at least, not that I can find). However, for some reason, this shrinking script only works on the two pages I mentioned - on every other page, it either doesn't work at all, or it only works about half-way. I have made sure the page.php and header.php templates both have accurate picture information in them, and can not find anything wrong anywhere. Is there any advice anyone here can give me on how to fix this? I've been doing html and css for awhile, but am relatively new to javascript and php, so am a bit out of my element on this. I'm willing to post any more code, snippets, whatever needed, just let me know what you need if you think you can help. Thanks, Brandon Page with iframe: http://www.siteworksweb.com/bbear2/pretest.html Hi - I have an iframed page which displays the contents of a form. I would like to be able to vary the height of this page depending the form contents (# of rental units returned) returned. Is there a way to resize this page (the 'child' iframe) dynamically according to the size of the form content? I don't have much control over the form data, which lives on a separate domain. Also, is there a way to resize the home page http://www.siteworksweb.com/bbear2/pretest.html back to it's original size when a user clicks the 'back' button in a browser after the form contents are displayed? I would appreciate any input to either of these questions. Thanks in advance for your time, Lisa Hi everyone, I run a streaming site and am looking to have the option on a chat room next to the stream. Not everyone likes having the chat facility so I'd like to make it optional. As the page loads I'd like the content to look like the diagram below with the stream (iframe1) taking up 95% of the page and the other 5% being taken up by an image which will say "open chat". The chat (iframe2) would have a width of 0%. Then when the "open chat" image is clicked I'd like the chat (iframe2) to become 35% and the stream (iframe1) to become 60%. If someone could make a nice sliding effect when the image is clicked that'd be even better. Here's a diagram to show what it'd look like with the resized iframes. If anyone can help me out and get this working to a good standard there will be a small paypal gift on offer . Cheers, Ben I am trying to dynamically resize an image. Here is my code: Code: <img border="0" src="images/right.gif" width="16" height="100" name="right"> <SCRIPT Language=Javascript> <!-- function ChangeImgSize(){ right.height = 3000; } ChangeImgSize() //--> </SCRIPT> This is on an asp page, and the <script> tag is the last thing on the page before </body> The image does not get resized. I've been testing the page on current browsers (IE 8, Firefox, Chrome). I'm certain I'm doing something newbish, I don't really know Javascript all that well. Thanks in advance, Skip Good Day Everyone, I need some help resizing an iframe to fit it's content. Basically, I have 10 spreadsheet pages saved as htm files. I am creating a page that enables me to view each of these htm files. I need the iframe to be resized for each htm file. This is my code: Code: <html> <head> <script language="javascript"> <!-- var state = 'none'; function showhide(layer_ref) { if (state == 'block') { state = 'none'; } else { state = 'block'; } if (document.all) { //IS IE 4 or 5 (or 6 beta) eval( "document.all." + layer_ref + ".style.display = state"); } if (document.layers) { //IS NETSCAPE 4 or below document.layers[layer_ref].display = state; } if (document.getElementById &&!document.all) { hza = document.getElementById(layer_ref); hza.style.display = state; } } function autoResize(id) { var winW = 0, winH = 0 ; if (document.body && document.body.offsetWidth) { winW = document.body.offsetWidth - 235; winH = document.getElementById('page').contentWindow.document.body.scrollHeight; } document.getElementById(id).height=(winH) + "px"; document.getElementById(id).width=(winW) + "px"; } //--> </script> <style type="text/css"> .yssOver{background-color:#ffffff;} .yssOut{ background-color:#E6EFFF;} #content { position:absolute; left:210px; top:40px; } html { overflow:off; } img { display:block; vertical-align:text-top;} h1{ color: #000000; font-family:"Arial",Times,sans-serif; font-weight:bold; font-size:12px; margin-bottom:0px; } #document{ position:absolute; top:0px; left:0px; } #menu{ margin: 0 0 0 0; padding-left:0px; border: 0 -10 0 0; } img.arrow { margin: 4 0 0 0; } table.menu td { border: 1px solid; border-color:#7D91D0; } table.div td { border: 0px solid; border-color:#7D91D0; } a:link {color: #000000; font-family:"Arial",Times,sans-serif; font-size:12px; text-decoration: none;} a:active {color: #000000; font-family:"Arial",Times,sans-serif; font-weight:bold; font-size:12px;} a:visited {color: #000000; font-family:"Arial",Times,sans-serif; text-decoration: none; font-size:12px;} a:hover {color: #000000; font-family:"Arial",Times,sans-serif; font-size:12px;} </style> </head> <body onLoad = "window.frames['page'].location = 'home.png'" > <table id=document border=0 cellpadding=0 cellspacing=0> <tr><td> <img src=halifax_logo.png></img> </td><td width=100%> <img src=headerback.png width=100% height=80></img> </td></tr> <tr><td> <table width=95% class=menu border=1 id=menu border=0 cellpadding=0 cellspacing=5 background=menuback.png> <tr><td> </td></tr> <tr><td class=menutd background=tdback.png> <a href="cofunds designations.htm" target="page"> Cofunds Designations</a> </td></tr> <tr><td class=menutd background=tdback.png> <a href="Commission Codes Most Used.htm" target="page" " height=516 width=974 onmousedown="if(document.getElementById('div2').style.display == 'none'){ document.getElementById('div2').style.display = 'block'; }else{ document.getElementById('div2').style.display = 'none'; }"> Commission Codes</a> <div id="div2" style="display: none;"> <table class=div border=0 cellpadding=0 cellspacing=0 style=background-color:#E6EFFF; border: 1px solid; border-color:#7D91D0; width=100%> <tr><td> <img class=arrow src=side_grey_arrow.png></img> </td><td class="yssOut" onmouseover="className='yssOver';" onmouseout="className='yssOut';"> <a href="Commission Codes Most Used.htm" target="page">Most Used</a> </td></tr> <tr><td valign=top> <img class=arrow src=side_grey_arrow.png></img> </td><td class="yssOut" onmouseover="className='yssOver';" onmouseout="className='yssOut';"> <a href="Commission Codes.htm" target="page">All</a> </td></tr> </table> </div> </td></tr> <tr><td class=menutd background=tdback.png> <a href="corporate accounts1.htm" target="page"> Corporate Accounts</a> <div id="div3" style="display: none;"> <table class=div border=0 cellpadding=0 cellspacing=0 style=background-color:#E6EFFF; border: 1px solid; border-color:#7D91D0; width=100%> <tr><td> <img class=arrow src=side_grey_arrow.png></img> </td><td class="yssOut" onmouseover="className='yssOver';" onmouseout="className='yssOut';"> <a href="research.png" target="page">Research Centre</a> </td></tr> <tr><td valign=top> <img class=arrow src=side_grey_arrow.png></img> </td><td class="yssOut" onmouseover="className='yssOver';" onmouseout="className='yssOut';"> <a href="reports.png" target="page">Company Reports</a> </td></tr> </table> </div> <tr><td class=menutd background=tdback.png> <a href="dealers.htm" target="page"> Dealers</a> </td></tr> <tr><td class=menutd background=tdback.png> <a href="halifax funds.htm" target="page"> Halifax Fund Managers</a> </td></tr> <tr><td class=menutd background=tdback.png> <a href="other fund managers.htm" target="page"> Other Fund Managers</a> </td></tr> <tr><td class=menutd background=tdback.png> <a href="international codes.htm" target="page"> International Codes</a> </td></tr> <tr><td class=menutd background=tdback.png> <a href="market makers1.htm" target="page"> Market Makers</a> </td></tr> <tr><td height=750> </table> </td><td> <div id=content> <IFRAME name=page src="cofunds designations halifax.htm" onLoad="autoResize('page');" frameborder=0 overflow=no marginwidth=0 marginheight=0></iframe> </div> </td></tr> </table> </body> </html> This seems to work but it has a few issues, It does not resize properly for every link, only some of them. Can somebody please have a look & tell me where I am going wrong, or provide me with some better code, mine is a bit shoddy! Thanks Harry can any one say me how to resize a div by mouse dragging in javascript........ ..first of all is it possible or not?? and if so , what should i do...... |