Bootstrap4 jQuery水平动画

我有这个代码用于水平页面从左到右的动画。它工作正常，但突然停止工作。没有做任何改变

Page--3

link刚刚停止工作，点击

Page--4

和

Page--5

链接打开

Page--1

或

Page--2

Page--1

导航栏链接

Page--2

来自导航栏的链接

Page--3

导航栏的链接无法打开任何内容

Page--4

导航栏链接打开

Page--3

或

Page--2

Page--5有时有效有时打开
Page--1



html，正文{
身高：100%；
/*背景：线性梯度（向左，#283048，#859398）*/
溢出：隐藏；
}  
梅因先生{
利润率最高：5%；
页边距底部：0；
右边距：0；
mar`在此处输入代码`gin左：0；
宽度：500%；
身高：90%；
/*水平滚动必须使用*/
溢出：隐藏；
显示：内联flex；
空白：nowrap；
/*水平滚动必须使用*/
}
.主卡{
显示：内联块；
背景：透明；
身高：100%；
宽度：100%；
}
c开关{
边框颜色：白色；
}
.navbar深色.火腿图标{
背景图像：url（“数据：image/svg+xml；charset=utf8，%3Csvg viewBox='0 30'xmlns='0http://www.w3.org/2000/svg“%3E%3path stroke='rgba（255255255，1）'stroke width='2'stroke linecap='round'stroke mit='10'd='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E”）；
}












第1页
第2页
第3页
第4页
第5页
$（文档）.ready（函数（）{
$（“body”）.css（“溢出”、“隐藏”）；
$（'a[href^=“#page”]”）。在（'click'，function（）上{
event.preventDefault（）；
//横轴
$（'html，body'）.animate（{scrollLeft:$（$（this.attr（'href'））.offset（）.left}，1000）；
});
});
我的猜测是，因为您正在使
溢出
隐藏，而且从技术上讲没有水平滚动条，那么也没有
向左滚动
。至少这不是一个可预测的结果

我的建议是将父容器的边距设置为动画



html，
身体{
身高：100%；
/*背景：线性梯度（向左，#283048，#859398）*/
溢出：隐藏；
}
梅因先生{
利润率最高：5%；
页边距底部：0；
右边距：0；
mar`在此处输入代码`gin左：0；
宽度：500%；
身高：90%；
/*水平滚动必须使用*/
溢出：隐藏；
显示：内联flex；
空白：nowrap；
/*水平滚动必须使用*/
}
.主卡{
显示：内联块；
背景：透明；
身高：100%；
宽度：100%；
}
c开关{
边框颜色：白色；
}
.navbar深色.火腿图标{
背景图像：url（“数据：image/svg+xml；charset=utf8，%3Csvg viewBox='0 30'xmlns='0http://www.w3.org/2000/svg“%3E%3path stroke='rgba（255255255，1）'stroke width='2'stroke linecap='round'stroke mit='10'd='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E”）；
}












第1页
第2页
第3页
第4页
第5页
$（文档）.ready（函数（）{
$（“body”）.css（“溢出”、“隐藏”）；
$（'a[href^=“#page”]”）。在（'click'，function（）上{
event.preventDefault（）；
//横轴
让currentMargin=$（'.main'）.css（'margin-left'）.replace（'px'，''）；
让targetOffset=$（$（this.attr（'href'））.offset（）.left；
$（'.main'）。设置动画({
marginLeft:currentMargin-targetOffset
}, 1000);
});
});
谢谢上面的工作：）…但是，我会检查你提到的滚动条点…因为我昨天测试了它，在计算机和移动设备上运行良好。是的，我曾短暂地尝试输出
scrollLeft
值，每次似乎都是0。