CODEWITHSUNDEEP
javascriptjquery
Steven Langert
Steven Langert

Reputation: 1

Setting a variable after mouseover

$(".squares").on('mouseover', function(){
 $(this).css('background-color', getRandomColor());

getRandomColor() is a function which returns a random color function when a square in a grid is mouseovered.

I want to be able to go over once and the color changes, but if i go over a second time the color will stay the same. Right now the color just repeatedly changes after every mouseover. I know its probably going to require an if statement. I just don't know how to set the statement equal to a back-ground color.

Upvotes: 0

Views: 57

Answers (3)

DinoMyte
DinoMyte

Reputation: 8868

You can use unbind() event. This would unbind the mouseover event once its already invoked.

$(".squares").on('mouseover', function(){
 $(this).css('background-color', getRandomColor());
    $(this).unbind('mouseover');
});

http://jsfiddle.net/j6um1sq2/17/

Upvotes: 0

mapodev
mapodev

Reputation: 988

Use .one()

$(".squares").one('mouseover', function() {
 $(this).css('background-color', getRandomColor());
});

Upvotes: 2

Karl Gjertsen
Karl Gjertsen

Reputation: 4928

Could you add a 'data-' attribute, so you know if it has already been changed?

Upvotes: 0

Related Questions