Here is a jQuery script for sliding in letters, but how do I remove the last class of "fade out" so that the letters remain at their final position? Here is the demo:
http://blog.waiyanlin.net/example/jquery/flyingtext.html
and here is the script for it:
$(document).ready(function(){
$('.container .flying-text').css({opacity:0});
$('.container .active-text').animate({opacity:1, marginLeft: "350px"}, 1000);
var int = setInterval(changeText, 1000);
function changeText(){
var $activeText = $(".container .active-text");
var $nextText = $activeText.next();
if($activeText.next().length == 0) $nextText = $('.container .flying-text:first');
$activeText.anima开发者_开发技巧te({opacity:0}, 1000);
$activeText.animate({marginLeft: "-100px"});
$nextText.css({opacity: 0}).addClass('active-text').animate({opacity:1, marginLeft: "350px"}, 500, function() {
$activeText.removeClass('active-text');
});
}
});
This is extremely easy, 2 modifications are required. Remove animation, and clear timeout. You should have been able to figure this out yourself.
$(document).ready(function(){
$('.container .flying-text').css({opacity:0});
$('.container .active-text').animate({opacity:1, marginLeft: "350px"}, 1000);
var intval = setInterval(changeText, 1000);
function changeText() {
var $activeText = $(".container .active-text");
var $nextText = $activeText.next();
if ($activeText.next().length == 0) clearInterval(intval);
$nextText.css({opacity: 0}).addClass('active-text').animate({opacity:1, marginLeft: "350px"}, 500, function(){
$activeText.removeClass('active-text');
});
}
});
As per comments, here is a link to the working jsfiddle example: http://jsfiddle.net/Q8ZGA/
If I understand you correct you need to leave text after animation. In this case remove this string:
$activeText.animate({opacity:0}, 1000);
$activeText.animate({marginLeft: "-100px"});
Because you are fading it out.
Code (without interval): http://jsfiddle.net/uedt6/4/
精彩评论