Div与对角线边视差动画

Div with diagonal sides for parallax animation

本文关键字：视差 动画 对角线 Div      更新时间：2023-09-26

如何使两个对角线div滚动视差动画?我需要滑动过渡，就像这里的六个项目(子弹)https://victoriabeckham.landrover.com/INT，但有对角线边。

嗯…没有对角线div，但你可以旋转它们让它看起来对角线。可以通过CSS 3和旋转变换

来实现

参见:http://www.w3schools.com/cssref/css3_pr_transform.asp

和一个示例:http://www.w3schools.com/cssref/playit.asp?filename=playcss_transform_rotate

示例代码:

#myDIV
{
    transform:rotate(10deg);
}
个人注意:我认为你的方法应该是使用"正常"的div与"对角"的背景图像，并使你的div的内容出现一些动画取决于你的滚动位置，以创造一种错觉，你实际上是使用对角的div

UPDATE 1:这里有几个链接，我认为你会感兴趣的

  • http://unfold.no/
  • http://harvestcreative.com/
  • http://www.nike.com/jumpman23/aj2012/

UPDATE 2:另一个很酷的东西:http://www.css3shapes.com/

相关文章：