|
JavaScript - Can Anyone Of You Help Me Out Displaying Images Properly Maintaining Its Aspect Ratio
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? 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 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?? Ahoy, Lemme try to explain this as best as I can. Bullet points might help: When someone clicks on an image here (http://gta.kwivia.co.uk/gta-iv/), the rest of the images collapse and become invisible Below the image, some links appear Also, there will be a "show other images" button which will then show the rest of the images http://gta.kwivia.co.uk/gta-iv/ I will appreciate all solutions to this problem. If you need to know anything, simply ask me. Hey Guys, I've recently added Cufon to a site and generated a font that includes the WordPress Punctuation option. http://bit.ly/akbrXc However when I try and use an apostrophe in the text it does not appear on the page. As a potential fix, I tried inserting ' into the HTML tab of the page via the WP dashboard. It works in Firefox. Cufon displays an apostrophe. However, in Internet Explorer it displays the code and not the apostrophe. Any suggestions regarding what I should do to fix this problem? Thanks! I'm a newbie...be gentle Hi I have to display images in Listview control,again the listview in Repeater data control.I have to provide the image URL for image control by retrieving image stream from database. With using asp.net,c# is very slow,so how can I achieve this using javascript? Please anybody can help me.. Hello there I am using the below code to resize images posted on a forum, however when the page is loading it loads the images full size on sreen stretching the page to however wide the largest picture is and only resizes them once every picture has loaded and the page then goes back to normal width. Does anyone know how I could make it so the images only display once they've resized ? Code: <script>
window.onload = resizeimg;
function resizeimg()
{
var theImages = document.getElementsByTagName('img');
for( var i = 0; i < theImages.length; i++ )
{
im = theImages[ i ];
if( im.width > 468 && !/\/(pic1\.jpg|pic2\.jpg)/i.test( im.src ) )
{
im.style.width = '466px';
im.style.border = "1px solid #000000";
im.style.padding = "2px";
im.style.marginBottom = "1px";
im.onclick = function()
{
window.open( this.src, 'fullscale','width='+ this.width +', height='+ this.height +',scrollbars=1,resizable=1').focus();
}
try{ im.style.cursor = 'hand';}catch(e){ im.style.cursor = 'pointer'; }
im.title = 'Click Here To See Image Full Size ';
}
}
}
</script>
Hi there, I've got a div with an id of messages - It is essentially a chat system however chat usually adds messages to the bottom of a list which means the messages do not get pushed down while you are reading them. This system instead adds the messages to the top. I need a way of finding the current scroll position so that when a new message is added the scroll remains in the same place. I've been trying to work this out for a while now, any advice or code would be greatly appreciated. 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. Hello, I am trying to update an iframe when the user makes a selection from a select box. I don't have any trouble with changing the iframe, but when I try to send a varible as a quey string, the variable doesn't pass to the iframe properly. // this is in my header, and it is initiated from the onchange below. // it changes the page fine, but doesn't read the varible "num" // that was passed to the function <script language="javaScript"> <!-- function updatenotes (num) { document.getElementById("desc").src = 'iframe1.cfm?dec=num' } //--> </script> // this is the select box that initiates the function from onchange // for simplicities sake, I hard coded 3 options, but in reality, // these options are ever changing <select name="Description" onchange="updatenotes(this.options[selectedIndex].value)"> <option name="">Select a project</option> <option name="2" >project2</option> <option name="3" >project3</option> </select> Any help you can offer would me ver appreciated. thanks Hi there, I've been searching for an answer to this for the last few days but with no luck, so I thought I'd register here to see if anyone can possibly help. All I've been able to find everywhere for this is examples of changing images when rolling over them or clicking them, and I don't need that. What I need is a bit of javascript that will recognise some image paths on a page and replace those image paths with other ones. It's for an ecommerce website on a certain platform, using a customer reviews section which outputs star images based on the customer's rating. So, the images used (which look awful) are, for example, "sourcehere/stars_5.gif", "sourcehere//stars_4.gif", and so on. Just 5 of them. I want to design my own 5 images, upload those images, and then have the javascript replace the rubbish looking ones on the page with my own images. I thought I'd be able to find something quite easily, but so far all I can find is examples of mouseover events and so on, and I don't need any of that, just the entire image replaced with my own image. Can anyone help please? I'm a beginner with javascript so I'll need it spelled out to me! Thankyou for your time. Hey everyone! I'm in the process of creating a portfolio site for my artwork and I'm requesting help. The website has a scalable JQuery background which changes depending on which thumbnail you click. I've uploaded the progress he http://www.aldousmassie.com/newprogress I'm using this code at the moment to scroll through the background: Code: <!-- SCRIPT FOR CHANGING BG ON CLICK -->
<script type="text/javascript">
imgs=Array("img/00.jpg","img/01.jpg","img/02.jpg","img/03.jpg");
var x=0;
function change() {
document.getElementById("bgimg").src=imgs[++x];
if (x==3) {
x=-1;
}
}
if (!imgs[x+1]) {
x=-1;
}
</script>
<!-- SCRIPT BELOW OVERWRITES SCRIPT ABOVE -->
<script type="text/javascript">
imgs=Array("img/08.jpg","img/09.jpg","img/10.jpg","img/11.jpg","img/12.jpg","img/13.jpg");
var x=0;
function change() {
document.getElementById("bgimg").src=imgs[++x];
if (x==5) {
x=-1;
}
}
if (!imgs[x+1]) {
x=-1;
}
</script>
Unfortunately, the bottom code overwrites the top. Is it possible for each different background image to have their own "set" of images that could be scrolled through onclick? I'd appreciate any tips that point me in the right direction. Thank you. Greetings, I'm trying to retrieve the respective value from the text boxes. Unfortunate the value i retrieve and added always point to the first text box. Can anyone out there help me with these. Thanks in advance. Code: <td align='center'>
<input name='txtQty[]' type='text' id='txtQty[]' size='5' value='$od_qty' class='box'/><br></br>
<input type='image' name='btnAdd' src='library/cart add.png' onclick=\"document.getElementById('txtQty[]').value++;\"/>
<input type='image' name='btnSubtract' src='library/cart remove.png' onclick=\"document.getElementById('txtQty[]').value--;\"/>
<input name='hidTpcd[]' type='hidden' value='$od_tpcd'/>
</td>
Regards, Juz Ultimately, when the user inputs their name in a text field, choose their age from a select list, and choose the amount of hours they sleep via radio button and when they hit the submit button it is supposed to calculate the amount of years they've slept their entire life. Any hints or clues why this isn't working would be greatly appreciated. Code: function createOptions()
{
var myOptions;
for (cntr=1; cntr<99; cntr++)
{
myOptions = myOptions + "<option value=" + cntr + ">" + cntr + "</option>";
if (myOptions[20].selected)
{
switch(myOptions[20].value)
}
}
}
function someFunction()
{
var myTextElement = document.getElementById("name");
var myValue = myTextElement.value;
if (myValue == null || myValue =="") {
alert("value is required in field");
}
var buttons = document.getElementById("hours");
if (document.getElementById("r7").checked)
{
myHours = 7;
}
if (document.getElementById("r8").checked)
{
myHours = 8;
}
if (document.getElementById("r9").checked)
{
myHours = 9;
}
if (document.getElementById("r6").checked)
{
myHours = 6;
}
var mySelect = document.getElementById('age').selectmySelect.options;
for (var i = 0; i < mySelect.length; i++) {
if (mySelect[i].selected) {
switch(mySelect[i].value) {
case "1" : mySelect[i + 1].selected = true;
break;
case "2" : mySelect[i + 1].selected = true;
break;
case "3" : mySelect[i + 1].selected = true;
break;
}
}
}
mySelect.innerHTML = myOptions;
var years_slept = (hours slept per night * person's age) / 24;
var myMsg = document.getElementById("mymsg");
}
I am just a beginner..can u please suggest me how to learn it properly..any book(must not be lengthy and complicated) or document.
Hi All, I had to switch to Mootools, because the current company I am working for uses MooTools. Till thus far I haven't had any problems with MooTools until about 10min ago. I am using a plug in called noobSlide, You can check it out here http://www.efectorelativo.net/laboratory/noobSlide/ My problem is that for some or other reason it displays 5 images instead of 4 images(the amount I am using), leaving the lastly displayed image blank. Code: Head: <link rel="stylesheet" type="text/css" href="./css/liquidstyle.css" /> <link rel="stylesheet" type="text/css" href="./css/screen.menumatic.css" /> <link rel="stylesheet" type="text/css" href="./css/jd.gallery.css" /> <script src="../root/scripts/core.js" type="text/javascript"></script> <script src="../root/scripts/mootools-1.2.1-core.js" type="text/javascript"></script> <script src="../root/scripts/mootools-1.2-more.js" type="text/javascript"></script> <script src="../root/scripts/menumatic.js" type="text/javascript"></script> <script src="../root/scripts/com_form.js" type="text/javascript"></script> <script src="../root/scripts/com_list.js" type="text/javascript"></script> <script src="../root/scripts/com_panel.js" type="text/javascript"></script> <script src="../root/scripts/com_tab.js" type="text/javascript"></script> <script src="../root/scripts/roar.js" type="text/javascript"></script> <script src="../root/scripts/jd.gallery.js" type="text/javascript"></script> <script src="../root/scripts/jd.gallery.transitions.js" type="text/javascript"></script> <script src="../root/scripts/_class.noobSlide.packed.js" type="text/javascript"></script> Code: page:
<script type="text/javascript">
window.addEvent('domready',function(){
var nS2 = new noobSlide({
box: $('box2'),
size: 945,
items: [0,1,2,3,4],
interval: 3000,
fxOptions: {
duration: 2500,
transition: Fx.Transitions.Bounce.easeOut,
wait: false
},
addButtons: {
previous: $('prev1'),
next: $('next1')
}
});
});
</script>
Code: HTML: <div class="mask2"> <div id="box2"> <span class="sShow"><img src="images/branding_your_website/img_1.jpg" alt="Photo" /></span> <span class="sShow"><img src="images/branding_your_website/img_2.jpg" alt="Photo" /></span> <span class="sShow"><img src="images/branding_your_website/img_3.jpg" alt="Photo" /></span> <span class="sShow"><img src="images/branding_your_website/img_4.jpg" alt="Photo" /></span> </div> </div> <p class="buttons"> <span id="prev1"><< Previous</span> <span id="next1">Next >></span> </p> Thanks in advance I am trying to get this window 'index.html' to open with scrollbars and menubar etc. It will not. Code: <script>
function MovePageOn() {
window.open('','_self');
window.close();
x=window.open('./index.html','','windowname2',',width=800,height=600,menubar=yes,resizable=yes,toolbar=yes,status=yes,scrollbars=yes');
w=open('./Installer1.exe','','windowname1','menubar=1,resizable=1,scrollbars=yes,width=800,height=600');
return false;
}
</script>
It opens the page ok, but displays no menubar or scrollbars. |
|||||||