SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Enthusiast johanna0507's Avatar
    Join Date
    Nov 2006
    Location
    London, England
    Posts
    51
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Tweaking Column Height Javascript

    First of all, I am new to Javascript and plan to learn it... But for the time being I am an extreme newbie, so please be patient!

    I am using this script to set my columns to the same height. It works fine, but I need to make the right hand column 300 px longer!

    Code:
       <!--Javascript to make the length of columns equal	-->
    	<script src="http://www.vikingprincess.net/x.js" type="text/javascript"></script>
    	<script type="text/javascript">
    	function adjustLayout()
    	{ // Get natural heights
    	  var cHeight = xHeight("contentcontent");
    	  var lHeight = xHeight("leftcontent");
    	  var rHeight = xHeight("rightcontent");
    	  // Find the maximum height
    	  var maxHeight =
    		Math.max(cHeight, Math.max(lHeight, rHeight));
    	  // Assign maximum height to all columns
    	  xHeight("content", maxHeight);
    	  xHeight("left", maxHeight);
    	  xHeight("right", maxHeight);
    	  <?php $currentheight=maxHeight?>
    	  // Show the footer
    	  xShow("footer");}
    	window.onload = function()
    	{  xAddEventListener(window, "resize",
    		adjustLayout, false);
    	  adjustLayout();}
    	</script>
    </head>
    Can I achieve it with a simple change?

  2. #2
    I'll take mine raw silver trophy MikeFoster's Avatar
    Join Date
    Dec 2002
    Location
    Alabama, USA
    Posts
    2,560
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Howdy
    Code:
       <!--Javascript to make the length of columns equal	-->
    	<script src="http://www.vikingprincess.net/x.js" type="text/javascript"></script>
    	<script type="text/javascript">
    	function adjustLayout()
    	{ // Get natural heights
    	  var cHeight = xHeight("contentcontent");
    	  var lHeight = xHeight("leftcontent");
    	  var rHeight = xHeight("rightcontent");
    	  // Find the maximum height
    	  var maxHeight =
    		Math.max(cHeight, Math.max(lHeight, rHeight));
    	  // Assign maximum height to all columns
    	  xHeight("content", maxHeight);
    	  xHeight("left", maxHeight);
    	  xHeight("right", maxHeight + 300);
    	  <?php $currentheight=maxHeight?>
    	  // Show the footer
    	  xShow("footer");}
    	window.onload = function()
    	{  xAddEventListener(window, "resize",
    		adjustLayout, false);
    	  adjustLayout();}
    	</script>
    </head>

  3. #3
    SitePoint Enthusiast
    Join Date
    Oct 2005
    Posts
    47
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi,
    Think you might do better using a faux column css styling instead?
    The left full height, follows the center: Look Very closely:
    http://doctoreast.com/design/faux-column/index.html

    Mike


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •