How to use jQuery/Javascript to fadein/out text after a while
On Envylabs' site they have a feature where, below the logo, some text keeps changing after a few seconds.
I'm trying to find out what kind of JS/jquery function would do that. Can someone point to a tutori开发者_如何转开发al for this?
You should be using setInterval
together with fadeIn
and fadeOut
to do this. Something like this will work:
var taglines = ['Hello world!', 'Over the rainbow', 'Seeing is believing', 'Bloody hell where am I going?'],
count = 0;
setInterval(function(){
$('#tagline').fadeOut(300, function(){
$(this).text(taglines[(count++)%taglines.length]).fadeIn(300);
})
}, 3000);
See: http://jsfiddle.net/7n9Md/
They use fadeIn/fadeOut together with setTimeout()
You'll find it in http://envylabs.com/javascripts/all.js?1278040567 Line:15
var SubtitleCycle={...}
@samwick : Here is the script that can help you through the point which you are looking for, Try it out!
fadeRecord = function() {
var self = this;
var opacity = 0;
this.recordToEdit.style.opacity = opacity;
var timeInterval = setInterval(
function() {
opacity += 1;
self.recordToEdit.style.opacity = opacity/10;
if(opacity/10 == 1) {
self.recordToEdit = null;
clearInterval(timeInterval);
}
},
100
);
};
精彩评论