You must Sign In to post a response.

Jqyery button

jqyery buttons tutorials. i want if my mouse go over on button then button color change otherwise not.


Comments

#596406    Author: Shekar.Y    18 Mar 2011 Member Level: Gold   Points : 3

You can use the onmouseover, onmouseout javascript events for handling the such scenarios.

Refer to the following link which explains about change the background color of an achortag using onmouseover.

http://www.daniweb.com/web-development/web-design/html-and-css/code/216435

Hope this could help you.


Thanks
Shekar.Y

#596453    Author: Karthick NS  18 Mar 2011 Member Level: Bronze   Points : 4

Hi rohit,

Need not to write jquery codings for this. Use CSS files you can change the color of the button.

For ex:

<html>
<head>
<style type="text/css">
.btnOk{
color: #000;
background: #ccc;
width: 163px;
heigt: 63px;
}

.btnOk:hover{
color: #fff;
background: #000;
}

</style>
</head>
<body>
<input class="btnOk" type="submit" value="Ok" />
<input />
</body>
</html>

But Internet Explorer 6 doesn't support hover class of CSS.

if you want in jquery,
<style>
.hoverButton{
background: #ccc;
}
.normalButton{
background: #000;
}
</style>

<script>
$("#btnOk").mouseover(function(event){
$("#btnOk").removeClass( "normalButton" );
$("#btnOk").addClass( "hoverButton" );
});

$("#btnOk").mouseout(function(event){
$("#btnOk").removeClass( "hoverButton" );
$("#btnOk").addClass( "normalButton" );
});
</script>
Thanks & Regards,
Karthick NS


This thread is locked for new responses. Please post your comments and questions as a separate thread.
If required, refer to the URL of this page in your new post.