Why is my Jquery code behaving strangely?

Posted on 2011-10-16
Last Modified: 2012-05-12

Within the HTML file you will find that I have 5 child divs under the #sitedivs.

With this line of code I am trying to set each of the children's css "left" value
for (i=0; i<$("#sitedivs").children().length-1; i++)							
	$("#sitedivs div:eq(i)").css("left", i*$(window).width()+"px" );

Open in new window

Strangely this code does nothing at all.
However if instead of "i" value I were to put in real numerical values, it work, as shown below:
$("#sitedivs div:eq(3)").css("left",3*$(window).width()+"px" );

Open in new window

Please help as this is damned maddening!

thanks in advance
Question by:badwolfff
    LVL 27

    Expert Comment

    by:Lukasz Chmielewski
    Try this:

    					var ww = $(window).width();
    					var lft = i*ww;
    					$("#sitedivs div:eq("+i+")").css("left", lft+"px" );

    Open in new window

    LVL 27

    Accepted Solution

    Sorry for the tabulators, I guess the problem was with this:
    $("#sitedivs div:eq("+i+")")

    Write Comment

    Please enter a first name

    Please enter a last name

    We will never share this with anyone.

    Featured Post

    How to improve team productivity

    Quip adds documents, spreadsheets, and tasklists to your Slack experience
    - Elevate ideas to Quip docs
    - Share Quip docs in Slack
    - Get notified of changes to your docs
    - Available on iOS/Android/Desktop/Web
    - Online/Offline

    Having worked on larger scale sites, we found out that you are bound to look at more scalable solutions to integrating widgets, code snippets or complete applications and mesh them into functional sites, in any given composition. To share some of…
    Not sure what the best email signature size is? Are you worried about email signature image size? Follow this best practice guide.
    In this tutorial viewers will learn how to define a gradient in CSS. Create a new HTML document with an internal stylesheet.: Create a div in CSS and name it Gradient. Define the background as "linear-gradient(to right, #ee3668, black)". Ensure you …
    In this tutorial viewers will learn how add a scalable full-width header using CSS3. Create a new HTML document with an internal stylesheet. Set a tiled background.:  Create a new div and name it Header. Position it with position:absolute at the top…

    759 members asked questions and received personalized solutions in the past 7 days.

    Join the community of 500,000 technology professionals and ask your questions.

    Join & Ask a Question

    Need Help in Real-Time?

    Connect with top rated Experts

    11 Experts available now in Live!

    Get 1:1 Help Now