css页面滑触动的两种处理方法

  此雕刻篇文字首要伸见了css何以备止页面滑触动,小编觉得挺不错的,当今分享给父亲家,也给父亲家做个参考。壹道遂己幼编度过去看看吧

  效实描绘:

  移触动端当拥有 fixed 遮藏罩背景和弹出产层时,在屏幕上滑触动却以滑触动背景下面的情节,此雕刻坚硬是著名的滚触动效实。

  示例demo:

  样式:

  构造:

  在顺手机页面运转下面代码如图所示: 在灰色的遮藏罩上滑触动的时分 下面的 “测试文字” 也会跟着滑触动。

  

  处理方案壹:

  阻挡顶层 遮藏罩的默许行为。阻挡冒泡。

  示例demo:

  运转效实:

  

  处理方案二:

  比值先设置 body 的overflow : hidden; 此雕刻么超越产片断 就不会滑触动。当 遮藏罩 消失时,在设置body的 overflow: initial; 容许设置为 scroll即却

  示例demo:

  尽结:

  最骈杂的处理方案:

  在body上添加以此雕刻个样式即却避免避免滑触动。

  以上坚硬是css页面滑触动的两种处理方法的详细情节,更多请关怀php华语网其它相干文字!

  php华语网最新课程二维码

发表评论

电子邮件地址不会被公开。 必填项已用*标注