2013-02-26 2 views
2

У меня есть DIV, со скрытым переливом, весь CSS блок для этого DIV выглядит следующим образом:ScrollTop не работает в DIV с переливом: скрытый

.mainContainer .display_box .container .row .col_4 .dPost_box{ 
    position:relative; 
    height:100%; 
    width: 100%; 
    overflow:hidden; 
} 

Тогда, я хочу, чтобы сделать содержание DIV прокручивается каждый раз, когда я наводил на элемент. Однако это не сработает. Я попробовал jQuery.scrollTop(), а также обновил обычный scrollTop, это не сработало. Я также попытался использовать Smooth Scroll и Autoscroll плагинов, но ни один из них не будет работать. Мой текущий Javascript выглядит следующим образом:

function autoScroll(div){ 
    setInterval(function() { 
    if (div.scrollTop() < div[0].scrollHeight - div.height()){ 
     div.scrollTop(div.scrollTop() + 10); 
    }}, 1000); 
} 
$(document).on({mouseenter: function(){ 
    autoScroll($(this)); 
}, mouseleave: function(){   
}}, '.dPosts_post'); 

Я также попытался:

function autoScroll(div){ 
    setInterval(function() { 
    if (div.scrollTop() < div[0].scrollHeight - div.height()){ 
     div.scrollTop[0] +=10; 
    }}, 1000); 
} 

Но ничего не будет работать. Желательно, чтобы функция autoScroll работала, но если есть какие-либо плагины, которые будут работать, я был бы более чем счастлив попробовать их.

Любые мысли будут оценены. Благодаря!

+0

возможно дубликат [Как прокрутить в переливных скрытых делах до определенного в настоящее время невидимого элемента] (http://stackoverflow.com/questions/11301841/как к свитку-в-в-переполнение скрытых Div-к-а-определенный-настоящий-невидимый-Ele) –

ответ

0

Я не мог получить scrollTop, но я пришел с обходным путем. Вот код, если кто-то сталкивается с подобной проблемой в будущем:

funnction autoScroll(div){ 
    //check whether the content does not fit inside the div 
    if(div[0].scrollHeight>div.height()){ 

     //calculate how much the div needs to be scrolled 
     var distance = div[0].scrollHeight - div.height() + 20; 
     var topCoord = parseInt(div.css('top')); //inital top coordinate of the div 
     var lineHeight = Math.floor(parseInt(div.css('font-size')) * 1.5); 

     //calculate approximately how many lines there are in the distance that needs scrolling 
     var linesCt = distance/lineHeight; 

     //scroll the div at a pace of 2.5s per line 
     div.animate({top: topCoord - distance + 'px'}, 2500 * linesCt); 
    } 
}