커서를 손가락 포인터로 변경

커서를 손가락 포인터로 변경

나는 이것을 가지고 있다.a커서가 일반 링크처럼 손가락 포인터로 변경되도록 "on mouseover"에 삽입해야 하는지 모르겠습니다.

<a class="menu_links" onclick="displayData(11,1,0,'A')" onmouseover=""> A </a>

나는 내가 써야 할 곳을 읽었습니다:

onmouseover="cursor: hand (a pointing hand)"

하지만 저한테는 효과가 없어요.

게다가 나는 이것이 자바스크립트, CSS, 아니면 그냥 평범한 HTML로 간주되는지 확신할 수 없습니다.

<a class="menu_links" onclick="displayData(11,1,0,'A')" onmouseover="" style="cursor: pointer;"> A </a>

CSS입니다.

또는 스타일시트에서:

a.menu_links { cursor: pointer; }

CSS에서 이 작업을 수행할 수 있습니다.

a.menu_links {
    cursor: pointer;
}

이것은 실제로 링크의 기본 동작입니다.의 다른 "" "" "" "" "" "" "" "" "" ""가 없을 입니다.href속성(예에서 누락됨)을 입력합니다.

페이지에 링크가 하나만 있으면 이 링크를 사용하는 것이 좋습니다.

onMouseOver="this.style.cursor='pointer'"

대소문자로

a.menu_links:hover{ cursor:pointer}

만약 여러분이 이것으로 더 많은 일을 하고 싶다면 여기 멋진 것이 있습니다.URL에서 링크를 사용하거나 이미지 png을 저장하고 경로를 사용할 수 있습니다. 예:

url('assets/imgs/The Goods.png');

다음은 코드입니다.

.cursor{
  cursor:url(http://www.icon100.com/up/3772/128/425-hand-pointer.png), auto;
}

따라서 크기가 128 X 128인 경우에만 작동하며 이미지가 로드되지 않습니다.하지만 여러분은 실제로 여러분이 원하는 어떤 이미지도 사용할 수 있습니다!이것은 순수한 css3와 약간의 html로 간주될 것입니다. html에서 당신이 해야 할 모든 것은

<div class='cursor'></div>

그리고 오직 그 디브에서만, 그 커서가 보일 것입니다.그래서 저는 보통 바디 태그에 추가합니다.

위의 "최고의 답변"은 프로그래밍 방식으로는 정확하지만 실제로 제기된 질문에 대답하지는 않는다고 생각합니다.마우스 오버 이벤트에서 포인터를 변경하는 방법을 묻는 질문입니다.어딘가에 오류가 있을 수 있다는 게시물이 질문에 답하지 않는 것을 보았습니다.답변에서 있습니다( event는 비어 있습니다).onmouseover=""대신 스타일 옵션이 포함됩니다.왜 이것이 행해졌는지 이해할 수 없습니다.

문의자의 링크에는 문제가 없을 수 있습니다.다음 html을 고려합니다.

<a id=test_link onclick="alert('kinda neat);">Click ME!</a>

사용자 마우스가 이 링크 위에 있을 때 포인터가 손으로 바뀌지 않습니다...대신 포인터가 일반 텍스트 위를 맴도는 것처럼 동작합니다.이걸 원하지 않을 수도...따라서 마우스 포인터가 바뀌도록 지시해야 합니다.

다음과 같은 답을 찾고 있습니다(다른 사람이 게시했습니다).

<a id=test_link onclick="alert('Nice!');"
       onmouseover="this.style.cursor='pointer';">Click ME!</a>

하지만, 만약 여러분이 이것들을 많이 가지고 있거나, 이런 종류의 것들을 여기저기서 사용하고, 어떤 종류의 변화를 만들기로 결정하거나 버그에 부딪힌다면, 이것은 악몽입니다. 그것을 위한 CSS 클래스를 만드는 것이 더 낫습니다.

a.lendhand {
  cursor: pointer;
}

그러면:

<a class=lendhand onclick="alert('hand is lent!');">Click ME!</a>

이 방법보다 더 좋을 수 있는 많은 다른 방법들이 있습니다.DIV, BUTTON, IMG 등이 더 유용할 수 있습니다.사용해도 문제가 없다고 생각합니다.<a>...</a>,그래도.

재릿의

추가 anhref속성을 사용하여 유효한 링크로 만듭니다.return false;이벤트 핸들러가 항법 수술을 유발하는 것을 방지합니다.

<a href="#" class="menu_links" onclick="displayData(11,1,0,'A'); return false;" onmouseover=""> A </a>

(또는 만들기displayData()거짓으로 반환합니다...="return displayData(..)

최상으로 표시된 답변에 언급된 순수 CSS를 통한 솔루션은 이 상황에 적합하지 않습니다.

이 항목의 예제에는 일반 정적 href 속성이 없습니다. JS만 호출하므로 JS 없이는 아무것도 수행할 수 없습니다.

따라서 JS로만 포인터를 켜는 것이 좋습니다.그래서 해결책

onMouseOver="this.style.cursor='pointer'"

위에서 언급한 바와 같이 (그러나 거기에 언급할 수 없습니다) 이 경우에 가장 좋은 것입니다. (그러나 일반적으로 JS를 요구하지 않는 일반적인 링크의 경우, JS 없이 순수한 CSS로 작업하는 것이 좋습니다.)

 <! ––  add this code in your class called menu_links -->
<style> 
.menu_links{
cursor: pointer;
}
</style>

위의 코드에서 [cursor:pointer]는 링크 위에 마우스를 놓으면 나타나는 커서와 같은 손에 액세스하는 데 사용됩니다.

그리고 [cursor: default]를 사용하면 나타나는 일반적인 화살표 커서가 표시됩니다.

커서와 커서 모양에 대해 자세히 알아보려면 아래 링크를 클릭하십시오. https://www.w3schools.com/cssref/pr_class_cursor.asp

div{cursor: pointer; color:blue}

p{cursor: text; color:red;}

<div> im Pointer  cursor </div> 
<p> im Txst cursor </p> 

언급URL : https://stackoverflow.com/questions/8809909/change-cursor-to-finger-pointer