Rotating through array continuously with jQuery

Question

I need to fade items from an array in and out continuously and I'm currently doing it as such:

var rotateHint = function() {
var hints = ['fe','fi','fo','fum'];
var hint;
var p = (function() {
    if (!hint || !hint.length) hint = hints.slice();
         return hint.splice(Math.random() * hint.length | 0, 1);
}())
$('#hint').text(p) //THE ERROR IS HERE...
          .fadeIn()
          .delay(1000)
          .fadeOut(200,function(){ 
            rotateHint();
            })
};

However it seems that .text(p) isn't working however if I look at p with an alert(p) the output is sound.

What element is #hint? Have you tried using html() instead of text() instead? — kei
– kei, Commented Aug 20, 2012 at 14:34
#hint is a simple <div></div> and yes I've also tried html().. — Andreas Jarbol
– Andreas Jarbol, Commented Aug 20, 2012 at 14:35

Michael Lumbroso · Accepted Answer · 2012-08-20 14:48:03Z

2

It seems to be working only from jQuery 1.7 Previous versions throw an error

But it's kind of weird to do a text() on an array no?

answered Aug 20, 2012 at 14:48

Michael Lumbroso

4,9935 gold badges29 silver badges34 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Split Your Infinity · Accepted Answer · 2012-08-20 14:55:30Z

-1

Check out this Fiddle. Seems it is already working.

For some added value I optimized your JavaScript code.

HTML

<div id="hint"></div>

JavaScript

(function() {
    var hints = ['fe', 'fi', 'fo', 'fum']
      , p;

    (function rotateHint() {
        p = hints[Math.round(Math.random() * hints.length)];

        $('#hint').text(p).fadeIn().delay(1000).fadeOut(200, rotateHint);
    }());

}());

Works on Safari 6, FireFox 14 and Chrome 21 Beta

edited Aug 20, 2012 at 14:55

answered Aug 20, 2012 at 14:39

Split Your Infinity

4,2391 gold badge23 silver badges19 bronze badges

Collectives™ on Stack Overflow

Rotating through array continuously with jQuery

2 Answers 2

Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Related