> 웹 프론트엔드 > JS 튜토리얼 > 아이콘 선형 회귀가 지정된 position_jquery로 대각선으로 이동합니다.

아이콘 선형 회귀가 지정된 position_jquery로 대각선으로 이동합니다.

WBOY
풀어 주다: 2016-05-16 17:25:31
원래의
1334명이 탐색했습니다.

아이콘이 대각선으로 움직이니 코드를 보세요

코드를 복사하세요 코드는 다음과 같습니다




아이콘 선형 회귀가 지정된 위치로 이동합니다.<br><meta http-equiv="Content- Type" content="text/html; charset=UTF-8"><script type="text/javascript" src="/js/jquery.3.5.2.min.m.js"></script> </head><div style="position: fixed;right: 0;top:100px;width: 125px; z-index:2000;"><div ><a target="_blank" rel="nofollow" href="https://www.520xingyun.com/from/188bet.php" ><img width="120px" height="550px" src="https://www.520xingyun.com/images/188_120.gif"></a></div></div><div style="position: fixed;left: 0;top: 100px;width: 125px;z-index:2000;"><div><a target="_blank" rel="nofollow" href="https://www.520xingyun.com/from/188bet.php"><img width="120px" height="550px" src="https://www.520xingyun.com/images/188_120.gif"></a></div></div><br><body style="font-size: 13px;"> ><div> ; <BR><div style="margin: 30px 0 30px 0;"> <br><br><div style="margin: 50px 0 0 500px;"><b id ="b" >B</b></div> <br><div style="margin: 80px 0 0 300px;"><b id="d">D</b> </div> <br></div> <br><div> <br><버튼 이름="이동">이동</버튼> ;재설정</ 버튼> <br></div> <br><!-- 확인 아이콘이 숨겨진 부동으로 설정되었습니다.--> <BR><div id=" ok" style=" 표시: 없음; 위치: 절대; 글꼴 색상: 흰색; 배경 색상: 빨간색;">확인</div> <br><br><script type="text /javascript" src= "http://jt.875.cn/js/jquery.js"></script> <br><script type="text/javascript"> <br><br> var pb = {왼쪽: $("#b").position().left $("#b").width(), 위쪽: $("#b").position().top};// B점 위치<br><br>var pd = {왼쪽: $("#d").position().left $("#d").width(), 위쪽: $("#d"). position().top };//D 포인트 위치<br>$("#ok").css({left: pd.left, top: pd.top});//처음에는 D 포인트에 OK 배치<br><br> $("button[name=move]").click(function() {//D 지점에서 B 지점을 이동하려면 이동 버튼을 클릭하세요<br>$("#ok").fadeIn() .animate({ <br>left: pb.left, <br>top: pb.top <br>}, 1000, function(){//1초 이내에 애니메이션을 완료합니다. 애니메이션 속도를 설정할 수 있으며, 완료되면 숨길 수 있습니다. <br>$("#ok" ).fadeOut() <br>}) <br><br>}) <br><br>$("button[name=reset]").click(function () {//초기 상태로 돌아가려면 재설정 버튼을 클릭하세요. <br>$("#ok").hide().css({left: pd.left, top: pd.top}); }); <br></script> <br></html>
관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
최신 이슈
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿