이 기사는 참조에 대한 JS 마우스 특수 효과 예제 코드를 공유합니다. 특정 내용은 다음과 같습니다
예 1 : 오른쪽 마우스 버튼을 비활성화하십시오
<script type = "text/javaScript"> // 문서 문서의 마우스 버튼에 대한 콜백을 정의합니다 .OnMousEdown = function (event) {// 이벤트 값이 마우스 오른쪽 버튼을 클릭하는지 확인하십시오 (event.button == 2) {alert ( 'Disable Right Click!'); // 사용자에게 마우스 오른쪽 버튼을 클릭하지 말라}} </script>0 버튼 누르지 않음
1 왼쪽 버튼을 누릅니다
2 오른쪽 버튼을 누릅니다
3 왼쪽 및 오른쪽 키를 누릅니다
4 중간 키를 누릅니다
5 왼쪽 및 중간 키를 누릅니다
6 오른쪽 및 중간 키를 누릅니다
7 모든 키를 누릅니다
예 2 : 마우스 포인터 모양을 동적으로 정의합니다
<script type = "text/javaScript"> // 마우스 모양 함수 초기화 initMouse () {// 태그 이름을 통해 대상 dom을 가져옵니다. 전체 웹 페이지 인 경우 Body Var Pdom = Document.getElementsByTagName ( "P") [0]을 사용할 수 있습니다. // 스타일의 마우스 포인터 모양을 수정, 포인터는 손의 모양입니다. style.cursor = '포인터'; } </스크립트>이름 속성 코드
기본 화살표 스타일 커서 : 기본값
손 모양 커서 : 포인터
손 모양 커서 : 손
크로스 화살표 커서를 움직입니다
질문 마크 커서 : 도움
크로스 헤어 커서 : 크로스 헤어
텍스트/편집기 커서 : 텍스트
릴리스 할 수 없음 (비활성화) 커서 : 드롭 없음
커서 비활성화 : 허용되지 않았습니다
자동 커서 : 자동
커서 : 진행
크기를 위쪽으로 변경하십시오. 커서 : N- 레드 크기
크기를 아래로 변경합니다. 커서 : S- 레드 크기
크기를 왼쪽 커서로 변경하십시오
크기를 오른쪽 커서로 변경하십시오
왼쪽 크기를 변경하십시오. 커서 : NW- 레즈 크기
크기를 아래로 왼쪽 커서로 변경하십시오 : SW-Resize
오른쪽 크기를 변경하십시오. 커서 : ne-restize
크기를 오른쪽 아래쪽 커서로 변경하십시오
예 3 : 마우스가 들어가서 종료 될 때 글꼴 크기의 변경
<script type = "text/javaScript"> // 마우스 포인터를 기능 발사 (pdom) {pdom.style.fontsize = '20px'; // 글꼴 크기를 20 픽셀로 크기를 조정} // 마우스 포인터를 이동 함수 mout (pdom) {pdom.style.fontsize = ''; // 글꼴 크기를 기본값으로 크기를 조정} </script> <!-영역 정의-> <p style = "마진 : 5px 자동; 너비 : 100px; 높이 : 100px; 테두리 : 1px Solid Black;" OnMouseOver = "Mover (this);"; onmouseout = "mout (this);"> 마우스를이 영역으로 이동하십시오 </p>Example 4:
<script type = "text/javaScript"> var nowpos; // 현재 위치 var mytimer; // 타이머 변수 함수 startIt () {// start function // 10 밀리 초의 시작 타이머를 시작하십시오. } // 함수 중지 함수 stopit () {// TIMER CLEARININTERVAL (MyTIMER)을 취소합니다. } // 스크롤 함수 함수 scrollpage () {window.scrollby (0,1); // 하나의 픽셀로 스크롤} document.onmousedown = stopit; // 클릭 이벤트 문서 스냅. // 이중 클릭 이벤트를 듣습니다 </script>예 5 : 마우스와 링크에 다른 색상이 나타납니다.
<script type = "text/javaScript"> // 마우스 오버 이벤트 함수 정의 definElinkColor () {// 웹 페이지에서 모든 링크의 dom을 가져옵니다. var linkdoms = document.getElementsByTagName ( "a"); // (var i = 0; i <linkdoms.lengths.length; i ++) {// 각 링크 마우스 오버 링크 링크를 정의합니다. // 현재 링크의 색상 스타일을 변경} linkdoms [i] .onmouseout = function () {this.style.color = ''; // 기본값을 복원}}}} </script>예 6 : 마우스 풀리를 비활성화합니다
<script type = "text/javaScript"> function init () {// 문서의 풀리 슬라이딩의 콜백 함수를 재정의합니다. // 사용자는 Pulleys Return False를 사용하지 말라고 메시지를 표시합니다. // 거짓을 반환하고 아무것도 수행되지 않습니다 (이 문장을 놓칠 수없고, 그렇지 않으면 여전히 스크롤됩니다)}; } </스크립트>위는이 기사의 모든 내용입니다. 모든 사람의 학습에 도움이되기를 바랍니다. 모든 사람이 wulin.com을 더 지원하기를 바랍니다.