Simple jquery not working?

JavaScript
1

It’s been a little while since I did any jquery and for some reason I am stuck on my second line of code.

var $pheight = $(window).height();

$(‘#col_left’).css(‘height’, $pheight);

All I need to do is take the height of the window and resize #col_left to that value.
Simple right? I can’t seem to see anything wrong with it. I do have jquery installed on the site so that is not the problem. I also have tested the variable with an alert and am getting the correct value. What is wrong here?

Thanks all

2

Is the #col_left element display: block? If it’s currently display: inline then it won’t do anything with the height.

Quick check would be to set block on it:


var $pheight = $(window).height();
jQuery('#col_left').css({
   height: $pheight,
   display: "block"
});

Could be something else in your css conflicting as well, I’d check there first before you change any javascript.

3

Thanks for the reply. Good thinking too but still not working.

Here is my css:

#col_left{
position:relative;
width:203px;
height:1000px;
background-image:url(…/images/col_fill.png);
background-repeat:repeat-y;
background-color:#f1f1f1;
float:left;
}

Any other thoughts?

4

How about giving it a unit of measurement:


jQuery('#col_left').css({
   height: $pheight + "px",
   display: "block"
});
5

Yea I thought about that but still nothing. When I check the markup in firebug it isn’t attaching the style attribute at all…? I have this working on other sites that is why I am totally confused as to why this isn’t working. Any other ideas…?

Really appreciate the help

6

Document.ready
Just a few weeks and already forgot…
idiot!!! :slight_smile: