jQuery .css ('right') 작동하지 않습니다.

jQuery에서 간단한 게임을 만들고 있습니다. 거미 이미지를 북동쪽으로 돌리는 데 문제가 있습니다. 북쪽 서쪽에서 잘 작동하지만 북쪽 동쪽에서 어떤 이유로 작동하지 않는 것 같습니다.jQuery .css ('right') 작동하지 않습니다.

// JavaScript Document 
function init(){ 

    angel = $('<img class="spider">').attr({ 
     'src': 'img/spider.png' 
    }).css({ 
     width: "125px", 
     height: "125px;", 
     'position': 'absolute', 
     top: -10, 
     left: -10 
    }); 

    //append it to body 
    $(document.body).append(angel); 

    //start dreaming 
    do_dream(); 
}

가 여기 북쪽 동쪽이나 북쪽에서 서쪽으로 회전을 담당하는 코드 내 일부이다 : 여기 내 초기화 코드입니다. 앞에서 말했듯이, 북서쪽은 완벽하게 작동하는 것처럼 보이지만 북쪽 동쪽으로 돌리려면 동일한 코드가 사용될 때 작동하지 않습니다.

// turn north west 
    if (parseInt(dream.css('top')) < parseInt(angel.css('top')) && parseInt(dream.css('left')) < parseInt(angel.css('left'))) { 
     $('.spider').attr('src', 'img/spider_nw.png'); 
    } 

    // turn north east 
    if (parseInt(dream.css('top')) < parseInt(angel.css('top')) && parseInt(dream.css('right')) < parseInt(angel.css('right'))) { 
     $('.spider').attr('src', 'img/spider_ne.png'); 
    }

출처

2011-10-01 Farhan Ahmad

난 당신 만() position''같은'매개 변수,''따옴표 내의 특정'CSS를 넣어 줄 이유 호기심, 아직 그들 모두입니다. – Sparky

right의 CSS 속성이 "자동"으로 설정되어 있으므로 "오른쪽"이 작동하지 않습니다. 다음을 사용하여 오프셋 권리를 계산 (이하여 현재 마우스 오른쪽 비교 표현을 대체) 할 필요가 : 롭-w @

(dream.parent().width() - dream.width() - dream.offset().left) < 
(angel.parent().width() - angel.width() - angel.offset().left)

출처

2011-10-01 15:51:56

하단에도 동일한 작업을 수행해야합니까? 그렇다면 하단 오프셋을 어떻게 계산합니까? –

같은 코드입니다. 'height'는'width'를,'top'은'left'를 교체합니다. –

나는 그것을 얻었다. 도와 주셔서 대단히 감사합니다 :) –

DOM 요소에는 배치 된 경우 DOM 요소의 '하단'및 '우측'속성 만 있기 때문입니다. 즉, 브라우저/jQuery는 .css('right')을 수행 할 때 윈도우/문서의 오른쪽 가장자리에서 자동으로 거리를 계산하지 않습니다.

원하는 항목이 오른쪽 가장자리의 위치 인 경우 왼쪽 가장자리와 너비의 위치를 추가하십시오.

출처

2011-10-01 15:49:57 millimoose

는 이유를 설명했다 또한 그것을 해결하는 방법을 부여했다.

또 다른 방법은 left, right, top, bottom의 네 가지 속성을 항상 설정할 수 있다는 것입니다. 높이와 너비를 설정할 필요가 없습니다.처럼 -

//width: "200px", 
    //height: "200px;", 
    'position': 'absolute', 
    top: y - 100, 
    left: x - 100, 
    right: x + 100, //(x - 100 + 200) 
    bottom: y + 100, //(y - 100 + 200)

출처

2011-10-01 16:01:29 Rifat

jQuery .css ('right') 작동하지 않습니다.

답변

관련 문제