开发者

Get width from the center of an element to the edge of viewport

开发者 https://www.devze.com 2023-04-07 17:33 出处:网络
Essentially the idea is to make Element-B and Element-C to cover the area horizontally starting from center of Element-A and ending at the edge of viewport.

Essentially the idea is to make Element-B and Element-C to cover the area horizontally starting from center of Element-A and ending at the edge of viewport.

So, I gues开发者_JAVA技巧s i want to get the distance value from the center of Element-A to the edge of viewport

Additional notes:

  1. Element-A doesnt have static position or size.
  2. Element-B and Element-C verticalposition or height is irrelevant.

Get width from the center of an element to the edge of viewport

I was thinking something like this:

  1. Calculate width of Element-A and divide it by two ( Or just get half the width if theres a way. )
  2. Get the distance from the edge of Element-A to the edge of Viewport
  3. Add up these calculated values.

( Of course unless theres way to get that this width straight up )

I was trying to look for a way to do list item 2. but couldnt find a way to do that.. and that more or less screws up my idea..

I have no starting point except the basic set-up for the images http://jsfiddle.net/nsEth/

Any ideas?


Something like this? http://jsfiddle.net/nsEth/1/

var a = $('#Element-A'),
    b = $('#Element-B'),
    c = $('#Element-C'),
    aw;

$(window).resize(function() {
    b.width( aw = a.offset().left + a.width()/2 );
    c.width( $(window).width() - aw).css('left', aw);
}).resize();
0

精彩评论

暂无评论...
验证码 换一张
取 消

关注公众号