我包括了css3动画在滚动:动画是工作的。问题是动画不适用于滚动显示。我使用的是on电-scrol.js。这是我的身体:
<div class="main">
<section class="home animatedParent">
<h1 class="animated swing">I am Leon Laci</h1>
<h3 class="animated swing slower">Front End Web
我想在滚动条上添加animate.css类,我的意思是当滚动条向下时,div应该使用动画fadeInUp动画,但是动画的速度应该减慢。我已经用jQuery动画()函数进行了测试,但它不适合我。
$(document).ready(function(){
$(window).scroll(function(){
var scrolls = $(window).scrollTop();
if(scrolls > 900){//from top to 900px my div appears
$(".box-animate").animate({functi
我有一个用CSS3制作动画的条形图,该动画当前在页面加载时被激活。
我的问题是,给定的条形图被放置在屏幕之外,因为它之前有很多内容,所以当用户向下滚动到它时,动画已经完成了。
我一直在寻找通过CSS3或jQuery只在查看者看到图表时激活条形图上的CSS3动画的方法。
<div>lots of content here, it fills the height of the screen and then some</div>
<div>animating bar chat here</div>
如果你在页面加载后非常快地向下滚动,你可以看到它的
NIm创建一个动画,该动画在滚动页上递增地移动div。我很接近,但我不认为我的代码是最有效的,我不知道如何调整它来添加更多的参数。例如,点击页面上的某个高度,就会将对象向右移动,并停止向下移动。下面是我的JS和代码可以在;
-原版
--关于右移的处理
var lastScrollTop = 0;
var boxPosition = $('#box').position();
var row2Position = $('#row2').position();
var distance = $('#row2').offset().top,
当用户滚动时,如何多次停止运行这些css和动画函数?目前,用户滚动的每一个像素都会触发它们,这会导致问题!
<script>
var elementPosition = $('#main-wrap').offset();
var x = 0;
$(window).scroll(function(){
if($(window).scrollTop() > elementPosition.top && x != 0){
$('#dropdown-navwrap .dropdown-bar').ani
我试着用的库制作一个动画。我通过使用.onscroll()来触发动画--但是我很难阻止滚动事件的频繁触发,而且它加快了动画的速度,因为.onscroll()每秒会多次调用它。
通过根据当前时间设置变量,我能够在第一次滚动时停止滚动事件的触发。
对于后续的滚动事件,我无法保持延迟,在每个滚动之后,变量的有效性越来越低。
我如何保持它,使滚动只触发动画启动一次,每个滚动事件,使它保持恒定的速度,无论我启动和停止滚动启动和停止动画多少次?下面是演示
这是代码
var t, l = (new Date()).getTime(), scrolling = false;
$(window).scroll