-1

我对 JavaScript 还很陌生,但之前有整体前端开发的经验。我试图让 JS 遍历提供的列表并在我的网站上显示结果。在移动到列表中的下一个之前,每个项目将显示一次。当它到达末尾时,最后一个项目将永久显示。我正在使用 Textillate JS 库。

我的代码有什么问题?

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<script>
var title-transitions = [
    "Create Solutions",
    "Build Relationships",
    "Design Brands",
    "Redifine Excellence"
    ],

    transitionCounter = 0,
    looped = false,
    textillateSettings ={
      loop:false,
      in:{
        callback:fucntion(){
          if(!looped) $('h1.introduction-heading').fadeOut(3800);
        }
      }
    };

var $h1 = $('h1.introduction-heading');
$h1.introduction-heading(textillateSettings);

var animationHero = set Interval(function(){
  transitionCounter =
  (transitionCounter == transition.legnth -1)
  ? 0 : transitionCounter + 1;

  if(transitionCounter == 0){
    looped = true;
    clearInterval(animatedHero);
  }

  $('h1.introduction-heading').remove();
  $('h1.introduction-heading')
    .text(transition[transitionCounter])
    .textillate(textillateSettings);

}, 6000);
</script>

这是textillate 网站的 url ,如果它可以提供任何帮助。

4

1 回答 1

0

这段代码有很多问题,但我只会首先回答明显的语法破坏问题,一旦你解决了这些问题,也许你可以再试一次。

callback: fucntion(){
    if(!looped) $('h1.introduction-heading').fadeOut(3800);
}

^ 'function' 的拼写错误

$h1.introduction-heading(textillateSettings);

^ 这是什么?您已经按类名选择了一个元素,如果您想将 textillate 应用于某些文本,它将是

$h1 = $('.introduction-heading');

$h1.textillate(textillateSettings);

最后:

var animationHero = set Interval(function(){

您要调用的方法是setInterval一个词

希望这些明显的问题能让您更接近解决方案。尝试清理语法时要小心。:)

于 2015-07-21T22:49:38.063 回答