43 users online (2 members and 41 guests)  


  Results 1 to 4 of 4

Related

  1. Scroll bar in table cell help    Forum: HTML Forum
    Replies: 14
  2. Hyperlink table cell    Forum: HTML Forum
    Replies: 11
  3. table cell background    Forum: CSS Forum
    Replies: 3
  4. table - cell hyperlinking    Forum: HTML Forum
    Replies: 3
  1. #1
    dawkim's Avatar
    New User

    Status
    Offline
    Join Date
    Jan 2004
    Posts
    4

    Unhappy manipulate table cell

    I have a project requiring an interactive temperature converter. I have to include a visual of a thermometer that adjusts to the temperature that is converted. I dont know whether I should use a table cell or bring in a graphic image. Here is my code for the table cell. I cannot figure out how to change the height of the cell to match the conversion output. Can someone help. Sample code would be great.
    <HTML>
    <HEAD>
    <SCRIPT LANGUAGE="JavaScript">

    <!-- Begin

    function show()
    {
    var far = document.degin.far.value
    var deg = Math.round((far - 32) * 5/9)
    document.degin.cel.value = deg

    }

    function showt()
    {
    var cels = document.itt.celt.value
    var fin = Math.round((cels * 9/5)+32)
    document.itt.fartw.value = fin

    }

    // End -->
    </script>
    </HEAD>
    <BODY>
    <div align="center">
    <h3><u>Fahrenheit to Celsius</u></h3>
    <form name="degin">
    Fahrenheit:
    <input type="text" name="far" size="5">
    <input type="button" value="Convert to Celsius -->" onClick="show()">
    <input type="text" name="cel" size="15">
    <input type="reset" name="ResetBtn" value="Reset">
    </form>
    <form name="itt">
    <h3><u>Celsius to Fahrenheit</u></h3>
    Celsius:
    <input type="text" name="celt" size="5">
    <input type="button" value="Convert to Fahrenheit -->" onClick="showt()">
    <input type="text" name="fartw" size="15">
    <input type="reset" name="ResetBtn" value="Reset">
    </form>
    <p>&nbsp;</p>
    <table border="0" cellpadding="0" cellspacing="0" height="200">
    <tr>
    <td valign="bottom" rowspan="2" width="43">Data </td>
    <td rowspan="2" width="1"> </td>
    <td height="65" bgcolor="#CCCCCC" width="22">
    <!--Adjust this cell height to force bottom cell height //-->
    </td>
    </tr>
    <tr>
    <td bgcolor="#FF0000" width="22" height="50" bordercolor="#996633"> </td>
    </tr>
    </table>
    <p>&nbsp;</p>
    </div>
    </BODY>
    </HTML>

  2. #2
    dawkim's Avatar
    New User

    Status
    Offline
    Join Date
    Jan 2004
    Posts
    4
    Figured this one out.

  3. #3
    willichan's Avatar
    New User

    Status
    Offline
    Join Date
    May 2004
    Posts
    1

    Lightbulb Non-table solution

    This might be a simpler method. I used this on a fund raising page. It uses horizontal bars rather than vertical, but with some modification, you should be able to go vertical.

    Code:
    <head>
    	<title>Sample Donation Percentage Bar</title>
    	
    	<script language="JavaScript">
    	<!-- Begin JavaScript
    	function percentbar(a,b){
    	  document.write("<div style='float: left;'>Goal: $" + b + "<br>");
    	  document.write("<div style='background: darkblue; float: left; width: 200px;'>");
    	  document.write("<div style='background: green; text-align: center; float: left; width: " + Math.min(Math.round((a/b)*100),100) + "%; height: 1em;'>");
    	  document.write(Math.round((a/b)*100) + "%");
    	  document.write("</div></div><br>");
    	  document.write("Acheived: $" + a);
    	  document.write("</div><br><br><br>");}
    	// End JavaScript -->
    	</script>	
    </head>
    
    <body>
    
    Here is an example of the donation bar.<br><br>
    <!-- percentbar(<achieved>,<goal>); -->
    
    <SCRIPT language="JavaScript"> 
    <!--hide 
    percentbar(60,195);
    //--> 
    </SCRIPT>
    <br>
    
    Over-acheivement is also taken into account<br><br>
    
    <SCRIPT language="JavaScript"> 
    <!--hide 
    percentbar(200,100);
    //--> 
    </SCRIPT>
    <br>
    
    </body>

  4. #4
    HTML's Avatar
    Administrator

    Status
    Offline
    Join Date
    Aug 2000
    Posts
    3,445

    Follow HTML On Twitter Add HTML on Facebook Add HTML on Google+ Add HTML on Linkedin Visit HTML's Youtube Channel
    welcome to the forums willichan

    Dave



Tags for this Thread