CODEWITHSUNDEEP
javascriptjqueryjquery-animate
XT_Nova
XT_Nova

Reputation: 1170

Why do i receive the error, "Can't find variable: $(this)"?

I bought a magazine on web design. In this mag they had an example for how to make a jQuery slideshow in "one line of code". (I seems like with their reasoning, that any compressed code is one line...)

Any how...

I tried to implement their example, but i get an error (in the console) that it can't find the variable $(this).

The HTML code just contains:

<div class="container">
    <ul>
        <li><img src="img/f.png" alt="f"></li>
        <li><img src="img/t.png" alt="t"></li>
        <li><img src="img/moon.png" alt="moon"></li>
    </ul>
</div>

Where all of the img tags has got the same position (on top of each other).

img {
    position: absolute;
    top: 100px;
    left: 100px;
}

The script is now supposed to animate, change the opacity of the different elements within the ul (which work for the first element animation).

JSfiddle here...

$(document).ready(function() {

    var t = setInterval(function(){
        $("ul li:last").animate({
            opacity: 0
        }, 1000, function(){
            $("ul li:first").before($this);
            $(this).css({'opacity': 1})
        });
    },5000);

});

The error, as mentioned before, is "Can't find variable: $this". Which the console points to .before($this).

Upvotes: 0

Views: 218

Answers (2)

thefourtheye
thefourtheye

Reputation: 239573

You need to create a jQuery object of the current element like this

$("ul li:first").before($(this));

Check the brackets around this

Upvotes: 0

Arun P Johny
Arun P Johny

Reputation: 388406

You don't have a variable called $this, you can just use the dom element reference this to relocate the element like

it should be $("ul li:first").before(this);

Upvotes: 1

Related Questions