扩展压缩div

时间:2011-10-25 16:52:21

标签: javascript jquery

http://jsfiddle.net/Y8MUF/

点击它可以展开div。如何通过添加“查看更多”链接使其看起来更漂亮然后在div开头时隐藏它并相对于查看更多链接调整行高?

$(document).ready(function(){
 var rowsshown = 2;
 var rowheight = 1.2; // line height in 'em'
 var ht = (rowsshown * rowheight) - .5; // subtracting the .5 prevents the top of the next line from showing
 $('.info')
  .css({'overflow':'hidden','line-height' : rowheight + 'em','height': ht + 'em' })
  .click(function(){
   if ( $(this).css('height') == 'auto') {
    $(this).css('height', ht + 'em');
   } else {
    $(this).css('height','auto');
   }
  });
})

2 个答案:

答案 0 :(得分:1)

答案 1 :(得分:0)

你可以看看jquery slideup和slidingown http://api.jquery.com/slideUp/

为了更好的效果