반응형
마우스 커서를 앵커와 같은 스타일로 변경
div
마우스 커서 위로 마우스를 가져 가면 HTML 앵커와 같은 커서로 변경됩니다.
어떻게 할 수 있습니까? Javascript가 필요합니까 아니면 CSS로만 가능합니까?
당신의 가정 div
을 가지고 id="myDiv"
, 당신의 CSS에 다음을 추가합니다. cursor: pointer
커서가 앵커 (하이퍼 링크)에 대한 사용은 같은 손 아이콘되도록 지정 :
추가 할 CSS
#myDiv
{
cursor: pointer;
}
다음 div
과 같이 간단히 의 HTML에 커서 스타일을 추가 할 수 있습니다 .
<div style="cursor: pointer">
</div>
편집하다:
이를 위해 jQuery를 사용하기로 결정한 경우 다음 줄을 $(document).ready()
또는 본문에 추가하십시오 onload
. ( myClass
모든 div
공유 클래스로 대체 하십시오 )
$('.myClass').css('cursor', 'pointer');
CSS 대신 jQuery에서이 작업을 수행하려면 기본적으로 동일한 프로세스를 따릅니다.
일부를 가지고 있다고 가정하면 <div id="target"></div>
다음 코드를 사용할 수 있습니다.
$("#target").hover(function() {
$(this).css('cursor','pointer');
}, function() {
$(this).css('cursor','auto');
});
그렇게해야합니다.
실제로 jQuery가 필요하지 않고 CSS 만 필요합니다. 예를 들어, 다음은 일부 HTML입니다.
<div class="special"></div>
다음은 CSS입니다.
.special
{
cursor: pointer;
}
이것은
#myDiv
{
cursor: pointer;
}
:hover
위의 답변에서 누락 되었다고 생각 합니다. 따라서 다음은 필요한 작업을 수행합니다. (css가 필요한 경우)
#myDiv:hover
{
cursor: pointer;
}
반응형
'programing tip' 카테고리의 다른 글
div의 CSS 워드 랩핑 (0) | 2020.08.23 |
---|---|
C # : 어셈블리의 모든 클래스 나열 (0) | 2020.08.23 |
SQL NVARCHAR 및 VARCHAR 제한 (0) | 2020.08.23 |
Java 문자열에 따옴표를 입력하는 방법은 무엇입니까? (0) | 2020.08.23 |
HTML5에서 캔버스를 중앙에 배치하는 방법 (0) | 2020.08.23 |