Thay đổi con trỏ chuột trên trang html

Tôi cần một cách thay đổi con trỏ chuột trên trang html. Tôi biết điều này có thể được thực hiện với css, nhưng tôi cần để có thể thay đổi nó trong thời gian chạy, ví dụ như có các nút trên trang và khi họ được nhấp, họ sẽ thay đổi con trỏ thành đồ họa tùy chỉnh cụ thể. Tôi nghĩ cách tốt nhất (hoặc chỉ?) Để làm điều này là thông qua javascript? Tôi hy vọng có một cách để làm điều này độc đáo mà sẽ làm việc trên tất cả các trình duyệt chính. Tôi sẽ rất biết ơn nếu ai đó có thể giúp tôi với điều này.Thay đổi con trỏ chuột trên trang html

Cảm ơn trước

Nguồn

2009-07-31 Clox

Cảm ơn bạn đã trả lời. Cuối cùng tôi đã làm việc đó. Đây là cách tôi đã làm nó:

<html> 
<head> 
    <script type="text/javascript"> 
     function changeToCursor1(){ 
      document.body.style.cursor="url('cursor1.ani'),url('cursor1.cur'), default"; 
     } 
     function changeToCursor2(){ 
      document.body.style.cursor="url('cursor2.ani'),url('cursor2.cur'), default"; 
     } 
    </script> 
</head> 

<body> 

    <form> 
     <input type="button" value="Change to cursor 1" onclick="changeToCursor1()" /><br> 
     <input type="button" value="Change to cursor 2" onclick="changeToCursor2()" /> 
    </form> 
</body>

tôi phát hiện ra rằng để có được nó để làm việc trong Firefox bạn phải vượt qua ít nhất 2 sự lựa chọn của con trỏ, ví dụ cursor = "url ('cursor1.cur'), mặc định" Hoặc nếu không nó sẽ không hoạt động. Ngoài ra, trong Firefox nó không hoạt động với ani-cursors, chỉ cur. Đó là lý do tại sao tôi đã đặt một cur sau ani. Ani sẽ hiển thị trong IE, phần giới thiệu trong Firefox.

Có ai biết nếu có thể thay đổi con trỏ trong IE mà không có cảnh báo X đang hoạt động hiển thị và người dùng phải chấp nhận không?

Nguồn

2009-07-31 04:49:37 Clox

http://www.javascriptkit.com/dhtmltutors/csscursors.shtml

Theres một ví dụ ở phía dưới.

Nguồn

2009-07-31 02:09:12

-1

//you can set all the normal cursors like this 
someElem.style.cursor = 'progress';

Con trỏ đặc biệt bạn muốn là gì? ... có thể có tùy chọn tốt hơn.

Nguồn

2009-07-31 02:16:42 scunliffe

-1

// Get the element you want to change the cursor for 
var el = document.getElementById('yourID'); 

// This image url is relative to the page url 
el.style.cursor="url(pathToImage.png)";

Nguồn

2009-07-31 02:20:42 Prestaul

Thật dễ dàng nếu bạn chỉ muốn thực hiện điều này trên Liên kết. Ở đó bạn có một số CSS như thế này:

a:hover { cursor: crosshair; } #this is when you mouseover the link 
a:active { cursor: wait; } #this is the moment you click it

Kể từ: hoạt động sẽ không làm việc cho Elements khác hơn là bạn có thể muốn sử dụng Javascript nêu bởi Prestaul và scunliffe.

Nguồn

2009-07-31 02:30:31 Hurix

Sử dụng JQuery:

$('.myButton').click(function(){ 
    $(this).css('cursor', 'url(/url/to/cursor/image)'); 
});

Nguồn

2011-05-29 06:38:56 Dave

Thay đổi con trỏ chuột trên trang html

Trả lời

Các vấn đề liên quan