831 posts
    Has been part of the Envato Community for over 4 years Has referred 1+ members Has sold $1,000+ on Envato Market Has collected 10+ items on Envato Market
+3 more
tigerlabs says

Does anyone know how I would a accomplish this layout? It can use a combination of jQuery and CSS .

Layout

Thanks in advance! :)

831 posts
    Has been part of the Envato Community for over 4 years Has referred 1+ members Has sold $1,000+ on Envato Market Has collected 10+ items on Envato Market
+3 more
tigerlabs says

*The title should be “Help accomplishing dynamic effect” whoops.

124 posts
    Elite Author: Sold more than $75,000 on Envato Market Has sold $250,000+ on Envato Market Located in Ireland Made it to the Authors' Hall of Fame
+5 more
OllieMcCarthy says

Just grab the heights. Something like this should work

var headerHeight = $('.header').outerHeight(), leftHeight = $('.left').outerHeight(), totalHeight = headerHeight + leftHeight; $('.sidebar').css('height', totalHeight+'px');

On a sidenote – how do I put line breaks into the code tag here!?

2024 posts
    Elite Author: Sold more than $75,000 on Envato Market Has sold $250,000+ on Envato Market Sells items exclusively on Envato Market Contributed a free file of the month
+8 more
revaxarts says

Just grab the heights. Something like this should work var headerHeight = $('.header').outerHeight(), leftHeight = $('.left').outerHeight(), totalHeight = headerHeight + leftHeight; $('.sidebar').css('height', totalHeight+'px'); On a sidenote – how do I put line breaks into the code tag here!?

use pre instead of code

140 posts
    Has been part of the Envato Community for over 3 years Has referred 1+ members Has sold $1,000+ on Envato Market Has collected 10+ items on Envato Market
+2 more
weblusive says

There is a specialized jquery plugin to accomplish this, called “equal heights”. Here is a link to the tutorial – http://www.cssnewbie.com/equalheights-jquery-plugin/

415 posts
    Has referred 10+ members Has sold $250,000+ on Envato Market Has collected 10+ items on Envato Market Elite Author: Sold more than $75,000 on Envato Market
+5 more
unisphere says
469 posts
    Has sold $250,000+ on Envato Market Has collected 1+ items on Envato Market Had an item featured in an Envato Bundle Elite Author: Sold more than $75,000 on Envato Market
+6 more
SaurabhSharma says

This might help: http://www.alistapart.com/articles/fauxcolumns/

+1. Fauxcolumns is the best choice. The only drawback is that the background color will be through an image. You can not provide CSS BG color options.

831 posts
    Has been part of the Envato Community for over 4 years Has referred 1+ members Has sold $1,000+ on Envato Market Has collected 10+ items on Envato Market
+3 more
tigerlabs says

Just grab the heights. Something like this should work

var headerHeight = $('.header').outerHeight(),
leftHeight = $('.left').outerHeight(),
totalHeight = headerHeight + leftHeight;

$('.sidebar').css('height', totalHeight+'px');

On a sidenote – how do I put line breaks into the code tag here!?

Thanks Ollie, I think I will try doing it this way.

Will let you know if it works out. :)

by
by
by
by
by
by