Zmiana wskaźnika myszy przy użyciu JavaScript

Chciałem użyć skryptu, aby zmienić wskaźnik myszy na mojej stronie przy użyciu JavaScript. Lepiej zrobić to przez CSS, ale moim wymaganiem jest skrypt, który może zostać rozpowszechniony wśród wielu osób w celu umieszczenia go w sekcji head swoich stron internetowych. poprzez CSS, to mogą być manipulowane przezZmiana wskaźnika myszy przy użyciu JavaScript

html 
{ 
cursor: *cursorurl* 
}

Jak zrobić to samo w JavaScript?

Źródło

2010-12-30 Cipher

Javascript jest całkiem niezły w manipulowaniu css.

document.body.style.cursor = *cursor-url*; 
//OR 
var elementToChange = document.getElementsByTagName("body")[0]; 
elementToChange.style.cursor = "url('cursor url with protocol'), auto";

lub z jQuery:

$("html").css("cursor: url('cursor url with protocol'), auto");

Firefox nie będzie działać, jeśli nie określić domyślny kursor po odwzorowana jeden !!

other cursor keywords

Należy również pamiętać, że IE6 obsługuje tylko .cur and .ani cursors.

working sample: 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<title>First jQuery-Enabled Page</title> 
<style type="text/css"> 

div { 
    height: 100px; 
    width: 1000px; 
    background-color: red; 
} 

</style> 
<script type="text/javascript" src="jquery-1.3.2.js"></script></head> 
<body> 
<div> 
hello with a fancy cursor! 
</div> 
</body> 
<script type="text/javascript"> 
document.getElementsByTagName("body")[0].style.cursor = "url('http://wiki-devel.sugarlabs.org/images/e/e2/Arrow.cur'), auto"; 


</script> 
</html>

Źródło

2010-12-30 16:22:51

Próbowałem tego

document.body.style.cursor = 'cursorurl';

Źródło

2010-12-30 16:22:22

Nie działa dla mnie, tylko z css ... –

Spójrz na tej stronie: http://www.webcodingtech.com/javascript/change-cursor.php. Wygląda na to, że możesz uzyskać dostęp do kursora poza stylem. Ta strona pokazuje, że jest wykonywana z całą stroną, ale jestem pewien, że element podrzędny działałby równie dobrze.

document.body.style.cursor = 'wait';

Źródło

2010-12-30 16:23:10

To działa, przy założeniu, że kursor jest faktycznie przenoszony, w przeciwnym razie pozostaje z istniejącym kursorem – s1cart3r

-1

W odniesieniu do @CrazyJugglerDrummer drugim sposobem byłoby:

elementsToChange.style.cursor = "http://wiki-devel.sugarlabs.org/images/e/e2/Arrow.cur";

Źródło

2010-12-30 16:45:10

To nie zmienia kursora dla mnie: - | Tutaj-> http://textb.in/39 – Cipher

-2

Albo można spróbować wykonać następujące czynności:

document.getElementById("id_of_target_element").setAttribute("style", "cursor:url(path_to_file.cur);")

Dla czasami target_element.style.property = value, nie pracował dla mnie z powodów nieznanych mi ...

Źródło

2013-08-13 16:32:55 apratimankur

Powiązane problemy

Zmiana wskaźnika myszy przy użyciu JavaScript

Odpowiedz

Powiązane problemy