Using jQuery change Background color of DIV

-

Change Background Color with jQuery:



If you want to change div text color by Jquery the visit this post. Change Text color

Jquery function :


$(document).ready(function () {

           $('div').hover(
         function () {
             $(this).css({ "background-color": "red" });
         },
         function () {
             $(this).css({ "background-color": "blue" });
         }
     );

       }); 

Jquery to change background color of div on hover:

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="divExample.aspx.cs" Inherits="divExample" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html>
<head>
<title>the title</title>
<%--<script type="text/javascript"
   src="https://code.google.com/p/jqueryjs/downloads/detail?name=jquery-1.3.2.min.js"></script>--%>
   <script type="text/javascript"
   src="Scripts/jquery-1.3.2.min.js"></script>
   <script type="text/javascript" language="javascript">

       $(document).ready(function () {

           $('div').hover(
         function () {
             $(this).css({ "background-color": "red" });
         },
         function () {
             $(this).css({ "background-color": "blue" });
         }
     );

       });

   </script>
   <style>
      .div{ margin:10px;padding:12px;
             border:2px solid #666;
             width:60px;
           }
  </style>
</head>
<body>
<table><tr><td align="center"><h1>Change Background Image of DIV using jQuery</h1>
   <p>Move mouse on any square below to see the result:</p>
   <div class="div" style="background-color:blue;"></div>
   <div class="div" style="background-color:blue;"></div>
   <div class="div" style="background-color:blue;"></div>

</td></tr></table>
</body>
</html>


jquery mouseover div change background color:


Download JQuery from:


https://code.google.com/p/jqueryjs/downloads/detail?name=jquery-1.3.2.min.js&

Learn How to work with Asp.net and C#:


Comments

Post a Comment