JQuery UI Draggable 요소의 시작 이벤트 핸들러 중에 CSS 위치 변경을 적용하려면 어떻게 해야 합니까?

StackOverflow https://stackoverflow.com/questions/1105133

문제

사용자가 드래그를 시작하자마자 드래그 가능한 요소의 위치를 ​​수정해야 하는 이상한 상황이 있습니다.그래서 드래그 가능한 요소의 시작 이벤트 핸들러 중에 위치를 설정하려고 합니다.이상하게도 위치를 변경한 후 자바스크립트 오류가 발생하는 작업을 수행하지 않는 한 위치 변경에 응답하지 않습니다.예는 다음과 같습니다.


<html>
<head>
<title>Drag reposition test</title>

<script type="text/javascript" src="js/css_browser_selector.js"></script> 
<script type="text/javascript" src="development-bundle/jquery-1.3.2.js"></script> 
<script type="text/javascript" src="development-bundle/ui/jquery-ui-1.7.1.custom.js"></script> <!-- Includes JQuery UI Draggable. -->

<style type="text/css">
    #draggable { width: 150px; height: 150px; padding: 0.5em; }
</style>

<script type="text/javascript">

$(function() {
    $("#initialdragger").draggable({    
        start: function(e, ui) {
            $('#initialdragger').css('top', 400);
            x = y; // Javascript error, which weirdly causes a redraw.
        }
    });     
});
</script>

</head>

<body>

<div id="initialdragger" class="ui-widget-content" style="border-width: 1px; border-color: black; background-color: orange; width: 300px">
    <p>Drag me around</p>       
</div>

</body>
</html>

이 맥락에서 합법적으로 다시 그리기가 발생하도록 하려면 어떻게 해야 합니까?JQuery의 hide() 및 show()가 작동하지 않으며 둘 다 작동하지 않습니다. 이러한 방법.

도움이 되었습니까?

해결책

나는 mousedown 이벤트를 바인딩하면 원하는 것을 얻을 수 있다고 생각합니다.

<script type="text/javascript">
    $(function() {
        $("#initialdragger").draggable();
        $('#initialdragger').bind("mousedown", function(e) {
            $(this).css('top', 400);
        });
    });
</script>
라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top