开发者

Problem using equal height columns & jQuery Accordian

I'm using this plugin http://www.cssnewbie.com/equalheights-jquery-plugin/ to give me equal column heights so that I can stick a div to the bottom of a righthand side sidebar.

It's working fine, however in some of my pages I am using a jQuery accordian slider which means there is quite alot of info contained in the accordian even though it is hidden.

The problem is the equalheights plugin doesn't seem to recognise that this info is hidden and therefore is matching the height of the main column as if all the info in the accordion is being displayed, therefore giving me a really long sidebar and a short main content div (as the info is closed up in the accordion drawers).

Can anyone let me know how I might fix this?

Here's my js here -

 //functions to be executed on page load
$(function(){

 //Open all links with rel="external" in new window
 $('a[rel="external"]').click( function() {
   window.open( $(this).attr('href') );
   return false;
    });


 //Alternate Table Colours
    $(function(){
    $("tr:odd").addClass("odd");
 });

 //Equal Column Heights
    $(function(){
 $('#primary-content,#secondary-content').equalCols();
 }); 

in the head of the pages using the accordion I have this code -

<script 开发者_JAVA技巧type="text/javascript">
$().ready(function(){
 $('#list1b').accordion({
  autoheight: false
 });
});

Any help much appreciated! Thanks!


Here's a solution that works for me! Jquery accordion not removingClass and not swapping its Expand text for Collapse

another stackoverflow member helped me refine my unordered list accordion and then i made some adjustments to have of both columns be of equal height using the same plugin and the columns expand when the accordion does. i'm trying to get both columns to expand equally when the accordion expands, but at least on page load both columns are equal


I have accomplished something similar this way.

  1. You need to have the accordion open by default, so if javascript was not available then you would see all the content expanded.

  2. Now you need to let the equalHeight detect the height of the column with all the content expanded. this way the page will be tall enought to fit the content.

  3. Then add the collapsed classes to collapse the accordion.

The only downside is that the page will be as tall as all the content expanded. it will not adjust as you expand and collapse.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜