使用jquery,如何滚动到居中(垂直和水平)页面上的特定div?

里奥拉

我有一个显示座位表的网页(每个座位都是一个div)。在某些情况下,页面很大,因此您可能必须向右或向下滚动才能找到座位。

我有一个包含座位名称的链接(这是您座位的div的ID)。我想要一些在页面加载时“发现”并“突出显示”您座位的jquery代码。

加载页面时,最好的滚动方式是将某个div置于页面的中心,这是最好的方法。一旦到达该位置,我便可以执行一些操作,例如暂时使div高以使其脱颖而出。

JSuar

工作示例: http : //jsfiddle.net/wonq8es4/3/

上面的示例滚动到div页面上的一个随机位置

// Get a random div or seat
var seat = $('#div' + randInt.toString());
// Slowly scroll to the top of the div element
$('html,body').animate({
    scrollTop: seat.offset().top-20, 
    scrollLeft: seat.offset().left-20
    },'slow');
// When the animation has completed hide, 
// change the background color, and fade in the div
$('html,body').promise().done(function(){
    seat.hide().css('background','yellow').fadeIn(1000);
});

基于此答案:https : //stackoverflow.com/a/8579673/1085891

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

如何使用 Bootstrap 在页面上垂直和水平居中卡片元素?

使用jQuery滚动到div中的元素并垂直居中

滚动到页面上的特定div时如何使页脚消失?

如何在响应页面上的div中垂直和水平居中放置两个图像

如何垂直居中水平滚动div

徽标和两个文本 div 在页面上垂直和水平居中

如何使div垂直和水平对齐居中?

将DIV在页面中垂直和水平居中

即使将页面向下滚动,也可以将div垂直居中并水平居中

平滑滚动到页面上的特定元素

如何使用jQuery滚动到页面顶部?

使用jQuery在垂直和水平方向上动态居中div

CSS:如何在 div 中垂直和水平居中图像

如何将div对象垂直和水平居中

如何垂直和水平居中未知高度的div

如何在整个页面上居中(水平和垂直)卡片,这也适用于移动设备?

div内垂直/水平居中的特定问题

如何使用jQuery滚动到特定项目?

Div布局阻止了从垂直滚动到水平滚动的转换

如何触发事件滚动到达页面中的特定div

如何为垂直居中的div设置动画,使其水平滑动到中心

div中的垂直和水平居中按钮

在div中将文本垂直和水平居中

在新页面上,自动向下滚动到特定的div

如何在刷新时使用JavaScript / jQuery滚动到页面顶部并排除特定术语?

CSS:如何在页面上水平居中这个特定元素?

如何使用Flexbox在页面上垂直对齐div

当用户使用Jquery和Waypoints滚动到页面顶部时如何触发事件?

使用jQuery垂直居中div