2010-12-14 53 views
6

Cách ẩn con trỏ chuột với jquery trong toàn bộ trang web. Tôi đã thử điều nàyCách ẩn con trỏ chuột với jquery

$(document).ready(function(){ 
     $(body).css({ 
      'cursor' : 'none' 
     }); 
}); 

Nhưng điều này không hoạt động trên tất cả các trình duyệt. Có plugin nào để thực hiện điều này không.

Cảm ơn trước.

+0

bạn có cung cấp dấu nháy đơn cho nội dung trong mã ban đầu của mình không ?? – kobe

+0

@gov: Ở đây tôi quên đưa ra một dấu nháy đơn nhưng, nhưng tôi đã đưa ra dự án của mình. – KillerFish

+0

Bằng mã trên ..firefox chỉ hỗ trợ .. – KillerFish

Trả lời

2
$('body').css('cursor', 'none'); 
+0

Brain tôi vừa chỉnh sửa Câu hỏi của mình. – KillerFish

+0

Các dấu ngoặc kép xung quanh 'cơ thể' là quan trọng. –

+0

Ngoài ra, điều này sẽ không hoạt động khi di chuột qua các phim Flash - điều đó sẽ cần được chú ý trong chính bộ phim đó. Ngoài ra, điều này sẽ không hoạt động đối với các phần tử đặt tên con trỏ rõ ràng trong CSS của chúng. Xem http://bugs.jquery.com/ticket/2066 –

1

Tôi đặt cược nó không liên quan gì đến phương pháp jQuery, nhưng trên thực tế CSS cho trang của bạn. Hãy chắc chắn rằng (sử dụng firebug) rằng phần tử cơ thể thực sự có thể nhìn thấy trên trang, nội dung có thể do tràn được đặt thành tự động theo mặc định, nhưng bạn cũng sẽ cần phải đặt chiều cao và chiều rộng cơ thể thành 100% để đảm bảo rằng khi bạn đang di chuyển chuột trên màn hình nó thực sự gọi body.mouseover()

Dưới đây là một ví dụ làm việc »http://jsfiddle.net/Ilmv/XQmqe/

+0

@ILMV: Google chrome không hỗ trợ tính năng này ... trong con trỏ chrome hiển thị ... ngay cả trong ví dụ làm việc của bạn .. – KillerFish

+0

Thật vui, nó đã hoạt động tôi ... và tôi đang sử dụng Google Chrome. Tôi đang gặp vấn đề với jsFiddle vào lúc này, tôi sẽ liên lạc lại với bạn. –

+0

Tôi đang sử dụng Google chrome 8.0.552.215 beta – KillerFish

0

gì về việc sử dụng một div lớp phủ trong suốt (div với một vị trí tuyệt đối, 100% chiều rộng và chiều cao và chỉ số z dương) với con trỏ được đặt thành không. Sau đó sử dụng jQuery để bật/tắt nó?

+0

Nó có thể là một ý tưởng để làm cho vị trí 'cố định' thay vì' tuyệt đối', tùy thuộc vào cấu trúc của tài liệu. –

+0

@Victor, đó có thể là một ý tưởng. Nhược điểm duy nhất trong kế hoạch của tôi là nếu trang dài hơn cửa sổ, họ có thể cuộn ra khỏi div rõ ràng. loại bỏ tràn! – PseudoNinja

0

Chắc chắn phải hoạt động trên tất cả các trình duyệt. Kiểm tra trong firebug yếu tố con trỏ xảy ra trên và xem nếu nó có một con trỏ "con trỏ:" rõ ràng; hoặc thiết lập tương đương.

0

Tôi nghĩ bạn có thể tạo lớp phủ với phần tử div khi trang đã sẵn sàng, bạn đặt chế độ hiển thị thành chặn.

HTML Mã sản phẩm:

<div>Test</div> 

CSS Mã sản phẩm:

div { 
    position: fixed; 
    left: 0%; 
    width: 100%; 
    height: 100%; 
    cursor: none; 
    visibility: block; 
} 

hy vọng nó có thể giúp u .. tôi thử nghiệm nó trên jsfiddle và nó làm việc cho tôi

Có lẽ nó những gì u tìm thấy

+0

Chrome không hỗ trợ .. – KillerFish

+0

@killerfish: Tôi không thử nghiệm trên Chrome, nhưng tôi sử dụng div không phải cơ thể ... Tại sao nó không hoạt động .. –

1

Một giải pháp khác có thể được thực hiện bằng cách tải custo m trong suốt ICO/PNG tập tin như con trỏ.

cursor: url('my-transparent-cursor.ico'); 

Vì vậy, người dùng hiện có con trỏ nhưng trong suốt, ẩn. Chỉ cần hai xu của tôi.

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