2013-11-14 48 views
0

我正在使用一个变种的jquery idtabs内的一个手风琴/幻灯片选项卡。最高选项卡的匹配高度 - 设置幻灯片高度

幻灯片高度由#tab1内容​​的内容设置,但这通常不是最高的制表符 - 因为其他制表符中的结果内容可能不会完全可见。

滑代码如下:

   <script> 
      $(function(){ 
       var slideHeight = 305; // px 
       var defHeight = $('#wrap').height(); 
       if(defHeight >= slideHeight){ 
        $('#wrap').css('height' , slideHeight + 'px'); 
        $('#read-more').append('<a href="#">SHOW MORE</a>'); 
        $('#read-more a').click(function(){ 
         var curHeight = $('#wrap').height(); 
         if(curHeight == slideHeight){ 
          $('#wrap').animate({ 
           height: defHeight 
          }, "normal"); 
          $('#read-more a').html('SHOW LESS'); 
          $('#gradient').fadeOut(); 
         }else{ 
          $('#wrap').animate({ 
           height: slideHeight 
          }, "normal"); 
          $('#read-more a').html('SHOW MORE'); 
          $('#gradient').fadeIn(); 
         } 
         return false; 
        }); 
       } 
      }); 

      </script> 

我相信使用原来的代码下面的变化应该能够解决这个问题,但我似乎可以成功合并的脚本。

   <script> 

       $(function(){ 

       var heighest = 0; 
       $('#wrap').each(function(){ 
        heighest = ($(this).height() > heighest) ? $(this).height() : heighest; 

       }); 

       $('#wrap').css('height',heighest + 'px'); 

      }); 

      </script> 

任何帮助/建议将不胜感激 - 这不是我的领域,我是一个照片的人。

谢谢。

+0

安置自己的提琴 – DaniP

+0

小提琴问题就在这里:[链接](http://jsfiddle.net/h6ty4/2/) – gmcswegan

回答

0

我认为你正在寻找这样的东西。请注意,没有元素#wrap,即使存在,$('#wrap').each(...)也会始终只处理一个元素。另外,还要考虑哪些元素已经在可视区域内显示

<script> 
    $(function() { 
     var slideHeight = 50, // px 
      wrapHeight = $('#wrap3').height(); 

     $('#wrap3 .usual2 div').each(function(){ 
      wrapHeight = ($(this).outerHeight() > wrapHeight) ? $(this).outerHeight() : wrapHeight; 
     }); 
     defHeight = wrapHeight + slideHeight; 

     if(defHeight >= slideHeight) { 
      (...etc) 
+0

谢谢。解决方案工作,但我需要删除“defHeight =”语句中的“+ slideHeight”;清除由2的组合添加的附加空白空间。 – gmcswegan

相关问题