jQuery css("left", val) does not seem to work

I am just trying out the tut from http://jqueryfordesigners.com/jquery-infinite-carousel/. I didn't follow line by line but the code in question is below

http://jsfiddle.net/sryKu/3/

开发者_运维技巧

if (currentPage < 1) {
    $wrapper.css("left", - (itemsPerPage * itemWidth) * (pages-1) + "px" ); // < ------ doesn't seem to get set
    currentPage = pages;
    console.log("wrapper left: " + $wrapper.css("left"));
} else if (currentPage > pages) {
    $wrapper.css("left", - (itemsPerPage * itemWidth) + "px"); // < ------ doesn't seem to get set
    currentPage = 1;
    console.log("wrapper left: " + $wrapper.css("left"));
}

The left does not seem to take effect ...

---

The problem was the animate taking two seconds and thus overriding your css('left',...) call.

The following code fixes this by only animating when you don't need to wrap around to the start: http://jsfiddle.net/sryKu/12/

EDIT: Played around a little bit (Can't help myself, love this kind of stuff) I've added animation for the wrap around to your code: http://jsfiddle.net/sryKu/28/ NOTE: This scrolls back thus isn't infinite as your code is.