Question

我想制作一个背景图片效果，这样可以让您在按下其中一张图片时将页面从一个页面平滑过渡到另一页面http://www.buildinamsterdam.com/，这样可以使其更大并且可以很好地过渡到下一页。

下面的HTML：

索引页：

<a href="another_page.html">Portfolio
 <div class="test"></div>
</a>

另一页：

<div class="test1"></div>

下面的css：

.test{
background-image: url("test.jpeg");
height: 100vh;
background-position: 70% center;
width: 700px;
background-size: auto 100%;
transform: matrix(0.8, 0, 0, 0.8, -329.75, 0);

}

.test1{
background-image: url("test.jpeg");
height: 100vh;
width: 100%;
transition: background-size 10s ease-in;
background-size: 100% 100%;

}

我是过渡和关键帧的新手，而不是非常有经验的开发人员所以不知道在这里使用什么，也许它需要jquery不确定。感谢任何人的帮助！

Answer 1

我查看了您分享的网站以及您的问题，我只能为您提供网站所使用的技术，以便您可以查看它并在项目中使用。希望它有所帮助;

因此，该网站使用了2个Javascript框架;

此处找到TweenMax https://greensock.com/tweenmax
Hammer在这里找到http://hammerjs.github.io/

我认为你可能会发现Hammer更重要，因为它会产生你想要的效果。请检查它们并让我知道。

背景大小转换到另一个页面

1 个答案: