如何解决检查元素的位置是否等于顶部:50%;左:50%;
我具有此功能(它确定string data = date.Replace("'","''")
是否在grid-container
内部,如果不存在,它将通过grid-container-wrapper
和{{1 }}。
grid-container
但是,如果top: 50%;
已通过left: 50%;
和$(window).resize(function() {
if(document.getElementsByClassName('grid-container')[0].getBoundingClientRect().right > document.getElementsByClassName('grid-container-wrapper')[0].getBoundingClientRect().right || document.getElementsByClassName('grid-container')[0].getBoundingClientRect().bottom > document.getElementsByClassName('grid-container-wrapper')[0].getBoundingClientRect().bottom || $('.grid-container').position().left < $('.grid-container-wrapper').position().left || $('.grid-container').position().top < $('.grid-container-wrapper').position().top) {
$('.grid-container').animate({opacity:0},200,function() {
$('.grid-container').css('top','50%');
$('.grid-container').css('left','50%');
$('.grid-container').css('transform','translate(-50%,-50%)');
} );
$('.grid-container').animate({opacity:1},400);
}
});
定位并且尚未移动(因此该位置仍等于grid-container
和{{1} }),即使top: 50%;
超出left: 50%;
,我也不希望函数被执行。
有没有办法做到这一点?
解决方法
如果您已经排名靠前:50%;左:50%,您可以将“ stopResisize”之类添加到网格容器或任何其他字段,并且当启动resize函数时,只需查看该类是否存在。如果是这样,则不做任何事情就返回。
$(window).resize(function() {
if($('.grid-container').classList.contains("stopResisize")) return;
if ( ... ) {
...
$('.grid-container').classList.add('stopResisize');
}
}
,
$(window).resize(function() {
if(document.getElementsByClassName('grid-container')[0].getBoundingClientRect().right > document.getElementsByClassName('grid-container-wrapper')[0].getBoundingClientRect().right || document.getElementsByClassName('grid-container')[0].getBoundingClientRect().bottom > document.getElementsByClassName('grid-container-wrapper')[0].getBoundingClientRect().bottom || $('.grid-container').position().left < $('.grid-container-wrapper').position().left || $('.grid-container').position().top < $('.grid-container-wrapper').position().top) {
if(window.innerWidth - document.getElementsByClassName('grid-container')[0].getBoundingClientRect().right + 20 < $('.grid-container').position().left || window.innerWidth - document.getElementsByClassName('grid-container')[0].getBoundingClientRect().right - 20 > $('.grid-container').position().left || document.getElementsByClassName('grid-container-wrapper')[0].getBoundingClientRect().bottom - document.getElementsByClassName('grid-container')[0].getBoundingClientRect().bottom + 20 < $('.grid-container').position().top || document.getElementsByClassName('grid-container-wrapper')[0].getBoundingClientRect().bottom - document.getElementsByClassName('grid-container')[0].getBoundingClientRect().bottom - 20 > $('.grid-container').position().top) {
$('.grid-container').animate({opacity:0},200,function() {
$('.grid-container').css('top','50%');
$('.grid-container').css('left','50%');
$('.grid-container').css('transform','translate(-50%,-50%)');
} );
$('.grid-container').animate({opacity:1},400);
}
}
});
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。