jquery는 모든 주요 브라우저와 호환되는 간단한 드래그 앤 드롭 효과 예제를 구현합니다.

저는 최근에 웹 페이지의 드래그 앤 드롭 효과를 발견했습니다. 저는 개인적으로 이것이 좋은 사용자 경험이라고 생각합니다. 시간을 들여 연구한 결과 다음은 간단한 드래그 앤 드롭 jquery입니다. 내가 작성한 사용자 정의 기능.
jquery 코드: fun.js

코드 복사 코드는 다음과 같습니다.

jQuery.fn .myDrag=function(){
_IsMove = 0;
_MouseLeft = 0;
_MouseTop = 0
return $(this).bind("mousemove",function(e) {
if(_IsMove==1){
$(this).offset({top:e.pageY-_MouseLeft,left:e.pageX-_MouseTop})
}
}); .bind( "mousedown",function(e){
_IsMove=1;
var offset =$(this).offset();
_MouseLeft = e.pageX - offset.left;
_MouseTop = e .pageY - offset.top;
}).bind("mouseup",function(){
_IsMove=0;
}).bind("mouseout",function(){
_IsMove =0;
})
}

html 코드:

코드 복사 코드는 다음과 같습니다.

http-equiv="content -type" content="text/html; charset=UTF-8">


🎜>

드래그 1

드래그 2< ;/div>



렌더링 1:


렌더링 2:

성명：

본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.