redpanda 101real
redpanda 101real

Reputation: 1

Mouse over not working in jquery

I am trying to make a button highlight when the cursor goes over it
the html is:

<head>
<script src="jquery.js></script>
<scrips src="index.html"></script>
</head>

and the js in index.js

$(".button").mouseenter(function(){
 $(".button).css("background-color", "cyan");
 $(".button).css("color", "white");
});

Upvotes: 0

Views: 39

Answers (3)

Christian Hur
Christian Hur

Reputation: 429

$(".button").mouseenter(()=>{$(".button")
   .css({"background-color":"cyan","color":"black"});
});

$(".button").mouseleave(()=>{$(".button")
   .css({"background-color":"#0084ff","color":"white"});
});

Upvotes: 0

D. Iwiński
D. Iwiński

Reputation: 3

Missed quotes in jQuery and html

HTML

<html>
<head>
   <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
</head>
<body>
   <button class="button" type="button">Change my color</button>
   <script src="custom.js" type="text/javascript"></script>
</body>
</html>

custom.js

$(".button").mouseenter(function(){
 $(".button").css("background-color", "cyan");
 $(".button").css("color", "white");
});

Upvotes: 0

Bryan Dellinger
Bryan Dellinger

Reputation: 5304

$(".button").mouseenter(function(){
$(".button").css("background-color", "cyan");
$(".button").css("color", "white");
});

https://jsfiddle.net/nroqjuhn/

Upvotes: 1

Related Questions