2014-12-08 2 views
0

Я хочу функцию в javascript, которая меняет мой курсор на png-изображение при нажатии кнопки. Это код, который я играл в html и javascript, но, очевидно, это не работает, может кто-то мне помочь?пытается изменить курсор в javascript

<form> 
    <input type="button" 
      onclick="changeCursor()" 
      value="click here" 
    /> 
</form> 

...

function changeCursor() { 
    cursor.style = "myImage.png" 
} 
+1

Нет такой вещи, как «курсор». Если вы хотите изменить курсор, вам нужно использовать CSS, а не JavaScript. – meagar

+0

но как мне изменить css в моем javascript – user3150635

+0

https://developer.mozilla.org/en-US/docs/Web/CSS/cursor/url – epascarello

ответ

2

При нажатии на кнопку добавить cursor свойство.

var btn = document.getElementById('btn'); 
 

 
btn.addEventListener('click', function() { 
 
    document.body.style.cursor = 'url(http://dummyimage.com/40x40/000/fff), auto'; 
 
})
html, body { 
 
    width: 100%; 
 
    height: 100%; 
 
    background-color: coral; 
 
    margin: 0 auto; 
 
}
<input id="btn" type="button" value="click here" />

+1

«когда кнопка нажата», а не на hover ... Активировано для остальных. – Amadan

+0

Я хочу, чтобы кнопка постоянно наводила курсор на изображение, а не только на то, как он нависает над ним, можете ли вы сказать мне, как я могу это сделать? – user3150635

+0

@ user3150635 - Проверьте изменения. –

0

, если вы хотите, вы можете использовать JQuery тоже:

HTML:

<form> 
    <input type="button" value="click here" /> 
</form> 

CSS:

body.newcursor 
{ 
    cursor: url(http://media.tumblr.com/tumblr_lqs4qoKE1V1qfoi4t.png), auto; 
} 

JQuery:

$(document).ready(function(){ 
    $('input').click(function(){ 
     $('body').addClass('newcursor'); 
    });   
}); 

пример: http://jsfiddle.net/jx6j6uho/2/

0

Вы можете повлиять на курсор, установив CSS в cursor: url(myImage.png), auto. Вы можете назначить это document.body.style, но вы бы перезаписали все, что есть, если вы не будете осторожны. Лучше всего назначить его классу CSS и добавить класс к элементу <body>.

Смежные вопросы