Change cursor on background hover

Question

I have an element (input) that has this code to give it a background on a small area (like a badge)

jQuery(this).css("background", "url(data:image/png;base64,<BASE64_ENCODED_DATA>) 99% 50% no-repeat scroll rgb(231, 248, 231)");

I want to make it so that when you hover the background the cursor will change to a pointer. Thank you

possible duplicate of [js/css changing cursor](http://stackoverflow.com/questions/3173666/js-css-changing-cursor) — Glenn Ferrie, Feb 11 '15 at 20:38

void · Answer 1 · 2015-02-11T21:53:14.653

1

jQuery(this).css({"background":"url(data:image/png;base64,<BASE64_ENCODED_DATA>) 99% 50% no-repeat scroll rgb(231, 248, 231)", "cursor":"pointer"});

or you can write css for that particular div

#particular_div{cursor:pointer;}

Hoping that the background is on body and the .container is the div for content then use

body:not(.container) {cursor:pointer;}

edited Feb 11 '15 at 21:53

answered Feb 11 '15 at 20:16

void

This is not what I ment, I want to cursor to change only when the mous is on top of the background image, not the entire element – Alon Feb 11 '15 at 21:49

score 1 · Answer 2 · answered Feb 11 '15 at 20:17

1

Let the div on which you want the cursor to be changed be #div1. So just change the CSS and use the cursor tag. You don't require JS

#div1{
  cursor:pointer;
}

answered Feb 11 '15 at 20:17

Dhruv Ramani

2 Answers2