滚动时的 CSS3 变换

2024-03-22

有谁知道一个好的教程可以实现这一目标? (如下所示:http://www.contrastrebellion.com/ http://www.contrastrebellion.com/) 我查看了该网站上使用的代码,发现提取我需要的内容很困难。

非常感激, 谢谢

编辑:也可以在这里看到:http://playgroundinc.com/ http://playgroundinc.com/

我想要实现的目标:

当我向下滚动时旋转 png 并旋转速度以匹配滚动速度。


这应该会让你朝着正确的方向前进:http://www.ianlunn.co.uk/blog/code-tutorials/recreate-nikebetterworld-parallax/ http://www.ianlunn.co.uk/blog/code-tutorials/recreate-nikebetterworld-parallax/ .

干得好 :

用于在滚动上设置旋转动画。

http://jsfiddle.net/EnSkJ/2/ http://jsfiddle.net/EnSkJ/2/

Code :

var sdegree = 0;

$(window).scroll(function() {

    sdegree ++ ;
    sdegree = sdegree + 3 ;
    var srotate = "rotate(" + sdegree + "deg)";
    $("img").css({"-moz-transform" : srotate, "-webkit-transform" : srotate});
});
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

滚动时的 CSS3 变换 的相关文章

  • 一行中单独一个元素的选择器? [复制]

    这个问题在这里已经有答案了 我们有带有 2 个子元素的 Flex 容器 当我们调整窗口大小并且其中一个弹性项目换行时 每个元素都位于其自己的行上 有没有像这样的选择器 when alone in row flex parent flex f
  • 使用 json.js 字符串化多维数组时出现问题

    我有以下问题 stringify 但我认为我的 JavaScript 数组一定是错误的 这是我的代码 var questions new Array Valid hover function for i 0 i lt Questions l
  • 选择倒数第二个元素

    我需要选择倒数第二个输入可选元素的值 tr td td tr
  • 为什么这个跨域ajax调用实际上有效?

    我无意中写了一个跨域AJAX调用NextBus http www nextbus com xmlFeedDocs NextBusXMLFeed pdf 使用 jQuery ajax url http webservices nextbus
  • 设置列表中前 10 项的样式

    可以使用像 li nth child 这样的东西来设置列表中前十项的样式吗 ol li item 1 li li item 2 li li item 3 li li item 4 li li item 5 li li item 6 li l
  • Flex、AngularJS + Masonry、akoenig/angular-deckgrid 等 [重复]

    这个问题在这里已经有答案了 我一直在发送此电子邮件 我即将发布一个用于 Web 应用程序安全的应用程序 它需要使用像 Masonry 这样的网格 我已经尝试过所有的 每一个角度模块 指令和不同的方法 包括基于 CSS 的技术 纯 Vanil
  • jQuery JSONP ajax,未设置身份验证标头

    我正在尝试使用以下设置向 google 联系人 API 发出 ajax 请求 ajax url https www opensocial googleusercontent com api people me all dataType js
  • Bootstrap 的网格每行列数

    Bootstrap 附带一个 12 列网格系统 必须放置在行内 我的问题是 列数 行数是否必须为 12 或更少 或者我可以有如下所示的布局吗 div class row div class col md 4 div div class co
  • PHP 多个 Ajax 请求:第一个请求阻止第二个请求

    我在一页上有 2 个 ajax 请求 我运行了第一个请求并单独启动了第二个请求 但第二个在第一个运行后停止工作 第一次结束后继续 第一个请求需要很长时间 大约 30 60 秒 此时我需要第二个请求来显示日志第一个请求发生的情况 我尝试使用
  • 使用javascript滚动滚动条或鼠标滚轮后触发事件

    我想知道是否可以触发事件after使用滚动条或鼠标滚轮 或在触摸设备上滑动 时滚动页面 基本上 我想检测用户何时停止滚动 以便我可以进行 AJAX 加载 而不是在滚动时加载 看起来jQuery s scroll 每次用户滚动时都会触发 并且
  • 如何在 jQuery Mobile 中将标题设置为全屏模式?

    当我设置属性时data fullscreen true 对于标题 它工作正常 但当我收到一些事件时 我确实需要在运行时执行此操作 我试过这个 document ready function data role header attr dat
  • CSS 聚焦于出现的输入 div [重复]

    这个问题在这里已经有答案了 我有这样的代码 div class lighter div
  • 如何使用 github 托管外部 CSS 文件?

    我将 css 上传到 github 然后转到网站上的文件并单击 raw 选项 我尝试将其添加到网页中 但 chrome 给出以下错误 资源解释为样式表 但使用 MIME 类型 text plain 进行传输 https raw github
  • 如何使用 HTML 和 CSS 在我的网站上显示社交图标?

    我拼命尝试向我的网站添加一些图标 但无法让它们正确显示 我想要的只是一个包含图像并在线显示它们的容器 然后我想在该容器和图像之间添加一些填充 仅此而已 看这里我的方法 如果有人可以帮助我并纠正我的代码 使其真正有效 我会非常高兴 在我的 H
  • CSS 过滤器在 Firefox 中不起作用

    我正在尝试 CSS 过滤器 但它在我的 Firefox 15 0 浏览器中不起作用 HTML div class google img src https www google com images srpr logo3w png div
  • 文件缓存:查询字符串与上次修改时间?

    我正在研究缓存网站资源的方法 并注意到大多数与我类似的网站都使用查询字符串来覆盖缓存 例如 css style css v 124942823 后来 我注意到每当我保存 style css 文件时 最后修改的标头都会 更新 使得查询字符串变
  • 如何在数据表角度中基于 JSON 动态填充表值?

    我在用着Angular 数据表 https l lin github io angular datatables 我需要能够根据返回的数据动态创建表 换句话说 我不想指定列标题 Example json数据 id 2 city Baltim
  • select2 验证 - 选择至少一个值

    我在用select2 http ivaynberg github io select2 and jQuery 验证 http jqueryvalidation org 插件 select2 的 HTML div class form gro
  • 使用 jQuery 从 ASP.Net JSON 服务获取数据

    我正在尝试调用 Google 地图地理编码 API 从纬度 经度对中获取格式化的地址 然后将其记录到控制台 我正在尝试获取为给定位置返回的第一个 formatted address 项目 我很简单无法从 JSON 中提取该项目 我不知道为什
  • jQuery DataTables:隐藏最后一行的“删除”按钮

    我有一个DataTable在某些情况下可以返回多个页面 返回的每一行都显示一个删除按钮 但我需要它在返回的最后一行上隐藏此按钮 无论是 1 pg 还是多个 因此不能在其中使用 CSS 我想学习如何实现这一点 因为DataTables对我来说

随机推荐