2013-07-11 3 views
0

나는 이것을 알아내는 것에 가깝지만 뭔가 빠진 것 같은 느낌이 든다. 나는 다수의 rect 위에 div 요소를 여러 개 배치하려고한다. 이미지지도. 모든 것이 내 콘솔에 잘 어긋나지 만, div와의 위와 왼쪽 위치를 설정하지 않는다.positon divs 위의 영역 모양 jquery와 상단 및 왼쪽 위치

아래는 내가 지금까지 가지고있는 것이지만 뭔가를 놓치고있는 느낌이다. 생명을 구하는 사람은 누구나 될 수있다 !!

이미지 맵 :

<div class="container"> 
    <div class="one">one</div> 
    <div class="two">two</div> 
    <div class="three">three</div> 
</div> 

JQuery와 : 맨 위에 배치 및 지역 모양의 위치를 ​​왼쪽해야

<img id="map" src="assets/img/header_bg2.png" width="1345" height="534" border="0" usemap="#neighbormap" /> 
    <map name="neighbormap" id="neighbormap"> 
    <areaclass="button" data-target="one" shape="rect" coords="335,239,376,282" href="#" /> 
    <area class="button" data-target="two" shape="rect" coords="401,116,438,155" href="#" /> 
    <area class="button" data-target="three" shape="rect" coords="493,7,536,42" href="#" /> 
</map> 

div를

$('#neighbormap').find('.button').each(function(index, element){ 
    var i, x = [], y = []; 
    var c = $(this).attr('coords').split(','); 
    var id = $(this).data('target') 
    for (i=0; i < c.length; i++){ 
    x.push(c[i++]); 
    y.push(c[i]); 
    } 
    var t = y.sort(num)[0]; 
    var l = x.sort(num)[0]; 

    $('.' + id).css({top: t, left: l, position:'absolute'}); 

    //console.log(t + ',' + l); 

    function num(a, b){ return (a-b); 
    } 
}) 

UPDATE :

나는 missi이었다. NG "PX는"그것은이 있어야한다 : $ ('.'+ ID)에 .css ({맨 : 내가 없어진

$('.' + id).css({top : t +'px',left : l +'px'}); 

답변

0

"PX는"그것은해야 t + 'PX'는 왼쪽 : 리터 + 'px'});