using css3 columns - how can get element position?

Question

To divide the long html file with the columns, I used css3 columns.

padding: 0px
height: 1024px
-webkit-column-gap: 0px
-webkit-column-width: 768px

And i wanted to get the position of the specified element, so i used the following javascript code.

function getPos(el) {
   for( var lx=0, ly=0; el!=null; lx+=el.offsetLeft, ly+=el.offsetTop, el=el.offsetParent);
         return {x:lx, y:ly};
}

I thought that the y value is in range of 0 to height:1024px, but that value exceeds 1024 and x value is in range of 0 to column-width:768.

How can i get the realative position from the first top left position which y is in 0 to 1024 and x is some value?

I'm sorry for my poor english.

Thanks.

chris5marsh · Accepted Answer · 2011-09-15 11:24:36Z

1

The jQuery method position returns the correct answer for this. Is it possible for you to include jQuery?

See http://jsfiddle.net/chris5marsh/GM2kp/ for an example.

answered Sep 15, 2011 at 11:24

chris5marsh

4683 silver badges13 bronze badges

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

2 Comments

cyberworld Over a year ago

Thanks. Can you explain more details? I've never used jquery before, so i'm a such mess.

chris5marsh Over a year ago

I wouldn't use jQuery just to perform this task. jQuery is a Javascript library that smoothes over a lot of cross-browser differences and makes it easier to code complex Javascript. Head to jquery.com for instructions on how to install and use it.

Collectives™ on Stack Overflow

using css3 columns - how can get element position?

1 Answer 1

2 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related