如何在重复序列之前重置css [英] How to reset css before repeating sequence

问题描述

我是新的JS和JQuery - 我曾经在80年代的基本编程，虽然我有一个粗略的了解变量和数组，我承认我没有抓住所有的js的括号。
我知道CSS和HTML很好。

I am new to JS and JQuery - I used to program in basic in the 80's and although I have a sketchy understanding of variables and arrays, I admit I haven't got to grip with all the brackets in js. I know CSS and HTML well.

通过googling我几乎得到了我想要的，这是一行文本从R移动到L，褪色和一条新线做同样的事情。也许有4个这样的文本行这样做和重复无限。

Through googling I have almost got what I want, which is for a line of text to move from R to L, fade and a new line to do the same thing. Perhaps have 4 of these text lines doing this and repeating infinitely.

为了更快的测试，我缩短了延迟。

For the sake of faster testing I have shortened the delays.

我不能发生的一件事是CSS左边：400px在动画开始之前重置。

The one thing I can't get to happen is for the CSS left:400px to be reset before the animation begins all over again.

不知道要放什么或放在哪里，但我已经尝试了所有这些，在许多地方！
我使用hello World向我显示代码被激活的位置，但没有帮助。

I don't know what to put or where to put it, but I have tried all of these, in many places!! I used hello World to show me where the code is activated, it didn't help.

//function reset(this){  $(this).removeAttr('style');}
//$(this).css('left', '500');
//$(elements).css('left', '500');
//removeAttr( 'style' );
//$("elements").removeAttr("style");
//$("#elements").removeAttr("style");
 //.text("Hello World");
//$("#Test1").text("Hello, world!");

我不太了解JQuery，但我已经看过大多数代码使用几个问题&回答网站，包括这里和我复制一些意见到代码，以帮助我了解发生了什么。
我做了我的第一个jsfiddle显示代码。它立即开始

I don't understand very much about JQuery yet, but I've seen most of the code I'm using on several question & answer websites including here and I copied some comments into the code to help me understand what's happening. I made my first jsfiddle to show the code. It begins immediately

http：// jsfiddle。 net / Stingraynut / Bf49z / 3 /

我希望有人在这里可以帮助我将CSS重置为左：400px后的4个动画。目前第一组4个工作，然后这些词都出现在屏幕左侧，他们不回到左边：400px

I hope someone here can help me reset the CSS back to left:400px after the 4 animations. Currently the first set of 4 work then the words all appear stuck left of screen, they don't go back to left:400px

Rob

推荐答案

很多jQuery函数都有 回调函数 。在这种情况下特别有用的是 .fadeOut（）函数的回调。通过更改回调函数中的CSS，您可以在转换后将其移回。

A lot of jQuery functions have a callback function. The one that is particularly useful in this case is the callback of the .fadeOut() function. By changing the CSS in the callback function, you can move it back after the transition.

$self.fadeOut(200, function(){
     $(this).css("left", "400px");   
 });

这篇关于如何在重复序列之前重置css的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！