Ändern Sie den Mauszeiger mit JavaScript

Ich wollte ein Skript verwenden, um den Mauszeiger auf meiner Website mit JavaScript zu ändern. Es ist besser von CSS gemacht, aber meine Anforderung ist ein Skript, das an viele Personen verteilt werden kann, um sie in den Kopfbereich ihrer Websites einzubetten. Durch CSS, kann dies durchÄndern Sie den Mauszeiger mit JavaScript

html 
{ 
cursor: *cursorurl* 
}

manipuliert werden, wie diese in JavaScript zu tun?

Quelle

2010-12-30 Cipher

Javascript ist ziemlich gut in der Manipulation von CSS.

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

oder mit jquery:

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

Firefox wird nicht funktionieren, wenn Sie einen Standard-Cursor nach dem abgebildeten eines angeben !!

other cursor keywords

Denken Sie auch daran, dass IE6 .cur and .ani cursors nur unterstützt.

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>

Quelle

2010-12-30 16:22:51

Ich habe das versucht

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

Quelle

2010-12-30 16:22:22

funktioniert bei mir nicht, nur mit css ... –

Blick auf dieser Seite: http://www.webcodingtech.com/javascript/change-cursor.php. Sieht so aus, als könnten Sie den Cursor vom Stil abwählen. Diese Seite zeigt, dass es mit der ganzen Seite gemacht wird, aber ich bin mir sicher, dass ein Kind-Element genauso gut funktionieren würde.

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

Quelle

2010-12-30 16:23:10

Dies funktioniert, unter der Prämisse, dass der Cursor tatsächlich bewegt wird, sonst bleibt es mit bestehenden Cursor – s1cart3r

-1

Im Hinblick auf die @CrazyJugglerDrummer zweite Methode wäre es:

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

Quelle

2010-12-30 16:45:10

Das ändert nicht den Cursor für mich: - | Hier-> http://textb.in/39 – Cipher

-2

Oder Sie können versuchen, die folgenden:

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

Für manchmal target_element.style.property = value, hat sich für mich nicht funktioniert aus mir unbekannten Gründen ...

Quelle

2013-08-13 16:32:55 apratimankur

Verwandte Themen

Ändern Sie den Mauszeiger mit JavaScript

Antwort

Verwandte Themen