【问题标题】:Create a Javascript Gallery with Background Images创建带有背景图像的 Javascript 图库
【发布时间】:2019-07-03 11:45:50
【问题描述】:

需要帮助创建一个完整的页面画廊。我尝试了各种选择。我正在尝试创建整页画廊,让用户一次垂直滚动 1 张图像。

这是我的代码:

<style>

#img1 {
background-image: url("<?php echo $image ;?>");
height:100vh !Important;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}

#img2 {
background-image: url("<?php echo $image2 ;?>");
height:100vh !Important;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}

#img3 {
background-image: url("<?php echo $image3 ;?>");
height:100vh !Important;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
</style>

<div id="img1"></div>
<div id="img2"></div>
<div id="img2"></div>

我坚持使用 javascript/jquery 解决方案来检测用户是否滚动。如果用户向上滚动 10 像素或向下滚动 10 像素,我想更改图像。

以下是我正在尝试实现的示例: http://themes.themegoods.com/photome/demo/gallery-archive/gallery-archive-fullscreen/

【问题讨论】:

    标签: javascript jquery css image gallery


    【解决方案1】:

    最好使用诸如“fullPage.js、智能滚动、pagePiling.js”之类的 js 库,它们可以帮助您制作完美的页面或画廊滚动,就像您想要实现的那样,有关更多信息,请访问以下链接:

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2015-06-20
      相关资源
      最近更新 更多