JavaScript (jQuery) for-loop question

Question

Hey all, I'm new to JavaScript and I'm using the jQuery library for this. Basically I'm trying to create multiples of this line and I'm using ":eq(0) to do it. The issue is that :eq(0) repeats 3 times in the code and with the loop that I'm doing every time it repeats it has a different number.

This is what I'm getting from it i think (:eq(0), :eq(1),:eq(2), :eq(3), etc..) I need it to do this (:eq(0),:eq(0),:eq(0), :eq(1) :eq(1) :eq(1), etc...)

for (i = 0; i < 6; ++i) {
    var $titleMarquee = '<marquee scrollamount="5" direction="left" width="233" align="left" behavior="alternate" loop="1"><span>';
    var $lieq = "li:eq("+i+")";
    $("ul.side-block-content "+$lieq+"").mouseenter(function() {
        $("ul.side-block-content "+$lieq+" .article-title a span")
            .replaceWith($titleMarquee+$("ul.side-block-content "+$lieq+" .article-title a").text()+"</span></marquee>");
    });
}

If anyone can let me know how to do this loop correctly, or maybe how to recreate the code for it to do the same thing that would be great.

Thanks in advance.

@Nick's answer:

var $titleMarquee = '<marquee scrollamount="5" direction="left" width="233" align="left" behavior="alternate" loop="1"><span>';
    for (i = 0; i < 6; ++i) {
        for (j = 0; j < 7; ++j) {
        $("ul.side-block-content li:eq("+i+")").mouseenter(function(){$("ul.side-block-content li:eq("+i+") .article-title a span").replaceWith($titleMarquee+$("ul.side-block-content li:eq("+i+") .article-title a").text()+"</span></marquee>");});
        $("ul.side-block-content li:eq("+i+")").mouseleave(function(){$("ul.side-block-content li:eq("+i+") .article-title a marquee").replaceWith('<span>'+$("ul.side-block-content li:eq("+i+") .article-title a").text()+"</span>");});  
        }
    }

This is what I'm using now and it's not working. Am I doing it correctly?

@Gilly3

$("ul.side-block-content li marquee").each(function() {
    this.stop();              // prevent the marquee from scrolling initially
    }).mouseenter(function() {
    this.start();             // start the scroll onmouseenter
    });

<marquee scrollamount="5" direction="left" width="233" align="left" behavior="alternate">

marquee has been deprecated outside of the first child of blink. — alex
– alex, Commented Apr 18, 2011 at 23:30
@alex: Shhhh. We're trying to let the blink tag die peacefully. — cHao
– cHao, Commented Apr 18, 2011 at 23:39
marquee isn't in HTML it's a browser-based code. But that's irrelevant to the question. — user713052
– user713052, Commented Apr 18, 2011 at 23:42

gilly3 · Accepted Answer · 2011-04-19 03:24:52Z

1

It looks like you are trying to make your <li> text scroll when you hover over it. Is that right?

Just put the marquee code in the original html and do this:

$(function ()
{
    $("ul.side-block-content li marquee").each(function() {
        this.stop();              // prevent the marquee from scrolling initially
    }).mouseenter(function() {
        this.start();             // start the scroll onmouseenter
    });
});

I also want to say not to use the marquee tag since it is deprecated and to use a jQuery plugin instead, but the last jQuery marquee plugin I saw was actually using a <marquee> in the back end anyway. So... pfft.

edited Apr 19, 2011 at 3:24

answered Apr 19, 2011 at 0:07

gilly3

92.6k26 gold badges148 silver badges179 bronze badges

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

2 Comments

user713052 Over a year ago

That's a genius way to do it! But I tried it and it doesn't stop it initially. Maybe I'm doing it wrong? I've updated my question with what I'm doing.

gilly3 Over a year ago

Make sure your code is run inside a domready handler. Ie, $(function () { /* your code here */ });

Nick · Accepted Answer · 2011-04-18 23:51:23Z

0

You could embed another for loop inside, like so:

for (i = 0; i < 6; ++i) {
  for (j = 0; j < 3; ++j) {
    // repeat i three times, and use :eq("+i+")
  }
}

answered Apr 18, 2011 at 23:51

Nick

4783 silver badges10 bronze badges

3 Comments

user713052 Over a year ago

Could you be more specific in that answer, I tried that but it wasn't doing anything for me.

alex Over a year ago

@user Think of it as for every time the outer loop loops, the inner loop will loop three times.

user713052 Over a year ago

I've edited my question with what I changed according to this answer.

Collectives™ on Stack Overflow

JavaScript (jQuery) for-loop question

2 Answers 2

2 Comments

3 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related