我正在努力实现以下体验:
- 向下滑动文字隐藏
- 将文本更改为存储在数组中的值(在文本完全隐藏之前不要更改文本)
- 向上滑动文字显示
不断发生的是文本在元素完全隐藏之前发生变化。这是在页面加载时运行的函数...
var welcomeText = function() {
var welcome = ["Bienvenue.", "Willkommen.", "Benvenuto.", "Bienvenido.", "Welkom", "欢迎", "Fáilte.", "Nau mai", "Welcome."],
title = $(".home-title"),
counter = 0;
setInterval(function() {
title.animate({"bottom":"-100%"},200);
title.text(welcome[counter]);
counter++;
title.animate({"bottom":""},200);
if(counter >= welcome.length) {
counter = 0;
}
}, 3000);
}
最佳答案
使用动画函数的完整参数。函数内部的代码只会在动画函数结束时执行。
title.animate({"bottom":"-100%"},200,function() {
title.text(welcome[counter]);
counter++;
title.animate({"bottom":""},200);
if(counter >= welcome.length) {
counter = 0;
}
});
关于javascript - JS/JQuery 隐藏元素、更改文本、显示元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36464440/