📝 Web设计教程中的视差滚动
10篇技术文档📅  最后修改于: 2020-10-21 06:02:08        🧑  作者: Mango
本教程旨在使您熟悉Web设计中的视差滚动。如果您在计算机或手机上使用任何现代网站,则当您向上/向下滚动网站时,可能会遇到一种效果,看起来整个屏幕都朝着滚动方向移动。如果这是背景效果,则滚动时前景信息会更改。可以将这种效果模糊地描述为视差滚动。阅读本教程时,您将了解滚动的历史,滚动的发展方式,视差滚动定义以及最后一些插件,以帮助您开始实施视差滚动。听众想要对网页设计中的视差滚动效果有更深入了解的任何...
📅  最后修改于: 2020-10-21 06:02:29        🧑  作者: Mango
如果您正在计算机或手机上浏览任何现代网站,则可能会体验到当您向下/向上滚动网站时,似乎整个屏幕都朝着滚动方向移动。如果这是背景效果,则滚动时前景信息也会改变。可以将这种效果简称为“视差滚动”。卷动让我们通过滚动了解它的含义。当您查看网页时,以任何方向(上,下,左和右)浏览网页的操作称为滚动。通常,如果您是台式计算机用户,则可以使用鼠标上的滚轮来完成此操作。历史让我们看一下单词“滚动”。在过去,为了...
📅  最后修改于: 2020-10-21 06:02:51        🧑  作者: Mango
现在我们已经了解了视差的起源和背景,让我们了解了Web设计中视差滚动的历史和概念。定义根据Wikipedia的介绍,视差滚动是计算机图形学中的一种技术,其中背景图像比前景图像移动通过相机的速度更慢,从而在2D场景中产生深度幻觉,并增加了虚拟体验中的沉浸感。在动画的早期阶段就使用了视差滚动。许多动画工作室(例如迪士尼)都使用多平面相机来实现视差效果。随着计算机图形技术与诸如JavaScript之类的...
📅  最后修改于: 2020-10-21 06:03:34        🧑  作者: Mango
本章讨论Web设计的概念以及在Web设计中使用视差滚动的优点。网页设计背景自20世纪初,纸媒已经陷入了恶性竞争,由于数字媒体。数字媒体包括我们在互联网上看到的内容,以及随之而来的相关杂志。您作为每周/每月订阅的一部分获得的新闻通讯也包含在数字媒体中。首先,数字媒体在很大程度上取决于移动和台式设备。当您可以在移动设备(手持式)和台式设备上看到内容时,它会有所不同。在任一设备上显示内容的方式都在发挥作...
📅  最后修改于: 2020-10-21 06:04:19        🧑  作者: Mango
对于Web开发人员而言,在创建视差滚动效果时,可以使用多种技术。这些技术之一是使用级联样式表(CSS)。CSS解释了HTML元素如何在屏幕上显示。可以创建一个CSS文件,并将其用于完整的网站。添加CSS文件比向每个HTML元素添加样式并在网页的不同部分进行管理要简单得多。注–本章下面讨论的某些方法特定于台式计算机,而不适用于移动设备。当特定技术不适用于移动设备时,将在步骤中提及。考虑到CSS将负载...
📅  最后修改于: 2020-10-21 06:05:25        🧑  作者: Mango
要创建视差效果,最流行的方法是使用JavaScript。从本章开始,我们将讨论JavaScript的概念以及用于实现视差滚动的一些库。使用纯JavaScript可以使网站性能保持最佳状态。从性能的角度来看,使用库还有许多其他优点。但是,为了更好地理解代码组织,我们将从纯JavaScript视差实现开始。有趣的是,有时纯JavaScript也称为VanillaJavaScript。使用纯JavaSc...
📅  最后修改于: 2020-10-21 06:05:43        🧑  作者: Mango
Bootstrap是一个流行的框架,具有许多现成的组件可供选择。 Bootstrap可以优化用于实现视差滚动的代码。在本章中,让我们以示例讨论如何使用巨无霸组件来实现视差滚动。带有Bootstrap4的全宽视差页面想象一下一个网站,其中向用户显示了一个大的“号召性用语”框,其中包含有关折扣或销售的一些内容。通常,超大型机可以在这样的地方找到应用。这是一个大盒子,可以吸引用户的注意。由于我们仅使用B...
📅  最后修改于: 2020-10-21 06:06:04        🧑  作者: Mango
在本教程中,我们研究了用于创建视差滚动的不同库。我们涵盖了从使用CSS的基础级别到使用Bootstrap进行前端开发的高级等所有方面。我们建议您运用自己的创造力来制作一个难以忽视的网页。请记住,对于视差滚动,在线上有大量示例可以为您提供启发。视差滚动的利用正如我们在介绍性章节中已经讨论的那样,您可以使用视差滚动来获得非凡的用户体验。这是网站的一些想法,您可以在其中包括视差滚动。时间轴网站这些类型的...
📅  最后修改于: 2020-10-21 06:06:19        🧑  作者: Mango
以下资源包含有关Web设计中视差滚动的其他信息。请使用它们来获得有关此方面的更深入的知识。Web设计中视差滚动的有用链接Web设计中的视差滚动Wiki-Web设计中的视差滚动的Wikipedia参考Web设计中有关视差滚动的实用书籍要在此页面上注册您的网站,请发送电子邮件至...
📅  最后修改于: 2020-10-21 06:06:31        🧑  作者: Mango
本教程旨在使您熟悉Web设计中的视差滚动。如果您在计算机或手机上使用任何现代网站,则当您向上/向下滚动网站时,可能会遇到一种效果,看起来整个屏幕都朝着滚动方向移动。如果这是背景效果,则滚动时前景信息会更改。可以将这种效果模糊地描述为视差滚动。阅读本教程时,您将了解滚动的历史,滚动的发展方式,视差滚动定义以及最后一些插件,以帮助您开始实施视差滚动。...