Question

我正在创建一个网页并使用来自http://www.thepetedesign.com/demos/jquery_super_simple_text_rotator_demo.html的简单文本旋转器插件，但我似乎无法显示所有4个元素。它似乎只挑选了四个中的两个并在它们之间保持旋转。我正在处理的部分的源代码如下，网站为http://www.goaptitude.com

<h1 class="promo-heading animated" data-fx="pulse">Changing how a 
                <strong class="text-rotator-fade color-high">
                    <span class="rotate">Student, Teacher, Parent, World</span>
                </strong> 
                learns
            </h1>

<script src="javascripts/jquery.simple-text-rotator.js" ></script>

感谢您的帮助，我真的很感激。

Answer 1

RononDex是正确的，问题只是淡入淡出部分，但是通过这个解决方案，顺序是错误的，第一个标签只出现一次。

正确的解决方案是只有部分代码处于错误的位置。

          index = $.inArray(el.text(), array)
          if((index + 1) == array.length) index = -1

必须在“el.fadeOut（）”部分之前。

这个应该解决问题：

 case 'fade':
          index = $.inArray(el.text(), array)
          if((index + 1) == array.length) index = -1
        el.fadeOut(settings.speed, function() {
          el.text(array[index + 1]).fadeIn(settings.speed);
        });
      break;

Answer 2

好的，我想我发现了这个错误：在插件js文件中将case "fade":的部分更改为以下内容：

                case 'fade':
                    el.fadeOut(settings.speed, function () {
                        index = $.inArray(el.text(), array);
                        if ((index + 1) == array.length) index = 0;
                        el.text(array[index + 1]).fadeIn(settings.speed);
                    });
                    break;

它似乎只影响那些使用动画“淡化”的人。另一个似乎没有受到这个bug的影响。

编辑： Demo here

文本旋转器卡在4个元素中的2个上

2 个答案: