滚动到包装内部的div而不是包装

我使用的是http://www.dconnell.co.uk/blog/index.php/2012/03/12/scroll-to-any-element-using-jquery/的jQuery代码滚动到包装中的包装。滚动到包装内部的div而不是包装

该代码提供动画身体（滚动身体下onClick）我试图动画滚动里面的div，而不是身体。

我下面的代码：

HTML：

<a href="#Div3" class="ScrollDown">Scroll Down</a> 

    <div class="Wrapper" style="height:400px; width:600px; overflow:hidden;"> 
     <div id="Div1" style="height:200px; width:600px;"></div> 
     <div id="Div2" style="height:200px; width:600px;"></div> 
     <div id="Div3" style="height:200px; width:600px;"></div> 
    </div>

jQuery的

function scrollToElement(selector, time, verticalOffset) { 
    time = typeof(time) != 'undefined' ? time : 1000; 
    verticalOffset = typeof(verticalOffset) != 'undefined' ? verticalOffset : 0; 
    element = $(selector); 
    offset = element.offset(); 
    offsetTop = offset.top + verticalOffset; 
    $('html, body').animate({ 
     scrollTop: offsetTop 
    }, time); 
} 

$(document).ready(function() { 
    $('a.ScrollDown').click(function (e) { 
    e.preventDefault(); 
    scrollToElement('#Div3'); 
    }); 
});

我知道它是与$（ 'HTML，身体'）动画（{} ）但我不知道如何改变它。

感谢

的jsfiddle http://jsfiddle.net/3Cp5w/1/

来源

2014-01-16 Dale

你包括jquery.min.js文件，我测试了它借机d对我来说，你能显示完整的代码 – sanjeev

是的，我有。 Heres小提琴http://jsfiddle.net/3Cp5w/1/ – Dale

动画包装，而不是身体：

$('.Wrapper').animate({ 
    scrollTop: offsetTop 
}, time);

http://jsfiddle.net/robbyn/qU6F7/1/

来源

2014-01-16 09:32:48

加入jQuery的更新文件参考

<script src="http://code.jquery.com/jquery-1.10.2.js" />

来源

2014-01-16 09:31:40

试试下面的代码

<body>  
<a href="#Div3" class="ScrollDown">Scroll Down</a> 

    <div class="Wrapper" style="height:200px; width:600px; overflow:scroll;"> 
     <div id="Div1" style="height:200px; width:600px;background-color:red;" ></div> 
     <div id="Div2" style="height:200px; width:600px;background-color:green;" ></div> 
     <div id="Div3" style="height:200px; width:600px;background-color:yellow;" ></div> 
    </div> 
</body> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> 
<script type="text/javascript"> 

function scrollToElement(selector, time, verticalOffset) { 
    time = typeof(time) != 'undefined' ? time : 1000; 
    verticalOffset = typeof(verticalOffset) != 'undefined' ? verticalOffset : 0; 
    element = $(selector); 
    offset = element.offset(); 
    offsetTop = offset.top + verticalOffset; 
    $('.Wrapper').animate({ 
     scrollTop: offsetTop 
    }, time); 
} 

$(document).ready(function() { 
    $('a.ScrollDown').click(function (e) { 
    e.preventDefault(); 
    scrollToElement('#Div3'); 
    }); 
}); 
</script>

我想你想DIV3向下内包装

您需要先指定包装的高度少数滚动，使滚动可见 & 为你猜改变HTML，身体.Wrapper

就求人

来源

2014-01-16 09:33:41 sanjeev

滚动到包装内部的div而不是包装

回答

相关问题