jquery position()이 완벽하지 않은 것 같습니다.

웹 응용 프로그램을 만들고 사용자가 원하는 위치로 텍스트를 드래그 할 수있는 몇 가지 기능이 있습니다. 저장 버튼을 클릭하면 다음 페이지에 같은 텍스트가 표시됩니다. 그들이 떨어 뜨린 위치에서. 작동하지만 위치가 완벽하지는 않지만 원래 위치와 다소 차이가 있습니다.jquery position()이 완벽하지 않은 것 같습니다.

나는 당신이 원하는 위치로 드래그 할 수 있습니다 원본 텍스트입니다 #의 텍스트 미리보기을 볼 수있는이 jsfiddle http://jsfiddle.net/rkumarnirmal/AmEeH/

이러한 기능을 구현했습니다. 떨어 뜨린 후 # ttext-preview을 # text-preview과 같은 위치로 옮기고 싶습니다. 그러나 # ttext-preview 위치는 변경되지 않습니다.

위치가 원래 웹 응용 프로그램의 위치가 약간 떨어지는 이유를 알고 싶습니다. 나는 jsfiddle에서 문제를 보여 주려고하지만, jsfiddle 자체가 작동하지 않는다. (나는 CSS를 바꿀 수 없다 의 속성 #ttext-preview 동적으로 jquery를 통해).

나를 안내 할 수 있습니까?

감사합니다.

출처

2012-05-20 rnk

이것은 확실하지 않지만 요소를 삭제 한 후 테두리 제거로 인해 jsfiddle에서 약간의 변화가 발생 했습니까? – koenpeters

예, 텍스트 위치가 약간 떨어지는 것을 보았습니다. 그 때문에 호버 국경으로 인한 것입니까? 하지만 그 경계가 필요해. – rnk

국경 문제에 대한 답변을 추가했습니다. 그것이 당신이 가진 문제인지 확실하지 않습니다. 국경없는 버전을 보여주기 위해 만든 피들을 확인해보십시오. – koenpeters

나는 그것이 때문에 당신이 동안 사용할 국경의 생각 이상 요소가 더 이상 0,0에없는대로, 위치 일을 irretate 수있는 이상한 가져가 국경을 사용하는 드래그. 이를 배경색으로 변경하면 제대로 작동합니다. http://jsfiddle.net/qvS2t/

테두리를 계속 사용하려면 호버링이 아닌 tekst에 여분의 패딩을 추가하고 호버가 활성 상태 일 때 테두리로 바꿉니다. 이 작업을 수행하는 방법을 보여주는 jsfiddle이 있습니다. http://jsfiddle.net/jdCAx/

출처

2012-05-20 13:16:56 koenpeters

상단 왼쪽에 3px를 추가했습니다. 그러나 여전히 다르다. jsfiddle에서 작동 예제를 보여 주시겠습니까? 감사! – rnk

나는 내 대답을 바꾸었고 쉽게이 문제를 해결하는 방법을 보여주기 위해 두 번째 jsfiddle을 추가했습니다. 희망이 도움이됩니다. – koenpeters

도움을 주셔서 감사합니다. @koenp하지만 지금 이것을보십시오 http://jsfiddle.net/rkumarnirmal/jdCAx/2/ 차이점을 볼 수 있습니까? – rnk

처음에는 .position()이 부모에게 RELATIVE 좌표를 가져옵니다!
국경/여백/패딩 문제 일 수도 있고, 여기 위에 많이 있습니다. http://api.jquery.com/position/! 당신이 가져가 때

출처

2012-05-20 13:15:37 Sliq

그래서 내가 원래 한 위치와 약간 다른 위치에 텍스트를 보여주는 어떤 실수를 했습니까? – rnk

하지만 텍스트가 드래그 가능하다는 것을 보여주는 좋은 호버 테두리가 필요합니다. – rnk

@rnk 문제는 요소 위에 마우스를 올리면 나타나는 BORDER입니다! div의 내부에 테두리를 만들거나 div 솔루션의 div를 통해이 작업을 시도하십시오. – Sliq

jquery position()이 완벽하지 않은 것 같습니다.

답변

관련 문제