当隐藏溢出时滚动到顶部

Question

有没有办法滚动overflow为hidden的元素的内容到顶部？

实施例用例：

1. 集装箱元件具有200像素一个最大高度，起始位置是在60像素。
2. 用户点击“显示更多”，高度扩大到200px。
3. 由于有超过200px允许的内容，用户可以滚动到列表的底部。
4. 当用户点击“显示更少”时，高度降低到60px。
5. 问题出现了，因为列表不再位于顶部而不是可滚动的。

这里的任何想法都会很棒。

Answer 1

我相信这是不可能的CSS。您可以尝试查看element.scrollIntoView。

正在搜索scrollIntoView我找到了这个question on SO答案建议使用jQuery的scrollTop。

Answer 2

你的意思是这样的吗？

http://jsfiddle.net/8pvjf/

它使用jQuery做确实

$(document).ready(function(){ 

     $('.background').css('font-size',($(window).width()*0.1)); 

     $(".blow").each(function(){ 

     }); 



     $('.blow').on('click', function(event){ 
var element = $(this); 
if(element.attr('data-blow') == 'true'){ 
    element.animate({ width:'24%', height:'20%' , opacity:0.6 }, 1000).attr('data-blow', 'false') 
    $(this).addClass('blow') 
    $(this).removeClass('overflow') 
} else { 
    element.animate({ width:'100%', height:'100%' , opacity:0.95 }, 1000, function(){ 
     $('body').animate({ scrollTop: element.offset().top }); 
    }).attr('data-blow', 'true').addClass('overflow').removeClass('blow'); 


} 

}）;

 $(window).resize(function(){ 
$('.background').css('font-size',($(window).width()*0.1)); 

}）;

玩得开心随着这些代码尽可能多的，你想要的。 当然，这是基于我以前的一些工作，您需要根据您的需要更改您的课程和样式。 :)