jquery-uiresponsive-design

I want this jquery to give me position in % not in pixels


Here is what I have right now with me. This gives me absolute position in pixels:

$(this).css({
 "left" : ($(this).width() + 5) * (index % 4),
 "top" : ($(this).height() + 5) * Math.floor(index / 4)
});

I want this to give the positions in percentage relative to the screen size.

Please help.


Solution

  • Jquery will not return the value in %.

    It will always return in px.

    So, to get the value in %, you can divide the value with either the top most node [1st parent in dom]

     parseFloat($(this).width() / $('#idOfFirstParent').width()) * 100;
    

    , if you want to get the value in reference to the 1st parent in the DOM or by width of the document [this will start with 0,0 of your screen].

     (parseFloat($(this).width() / $('window').width()) * 100).toFixed(2);
    
                                 or 
    
     (parseFloat($(this).width() / $('document').width()) * 100).toFixed(2);