aspx Tutorial

NET Articles,jQuery demo, asp.net with jQuery, online tutorial,Jquery, SilverLight, Javascript, asp.net,JSON, MVC,.NET Articles,demo, Web Services,
Advertise Here

Toolbar

Get our toolbar!

Advertize



Posted by Aamir Hasan   on Friday, May 28, 2010 Total Views:  

In this Example ,When user move mouse over the list, jquery will fire addclass event and CSS will be applied on <li>.

Overview

  1. Add Class
  2. Remove Class
  3. Jquery
  4. HTML Mark
  5. Output
  6. Conclusion

 

Add Class (addClass(CSS class name))

Class name is used to add class from set of elements.

Remove Class (removeClass(CSS class name))

Class name is used to remove class from set of elements.

 

Jquery

Add online Reference under head tag of your page as given below.

  <script src="http://code.jquery.com/jquery-latest.js" type="text/javascript"></script>

Add jquery functions under head section as given below

HTML Mark

Add unorder List as given Below

    <ul id="List">
        <li>Aamir Hasan</li>
        <li>Bill Gate</li>
        <li>Saba Khan</li>
        <li>Awais Ahmed</li>
        <li>Studentacad.com</li>
    </ul>

Output

conclusion

This is how simple to add and remove class on client side using jquery.

View online Demo

Download Source Code:ADD remove css.rar (3.15 kb)

Tags: , ,
Category: All | CSS | jQuery
Protected by Copyscape Online Plagiarism Tool
Comments are closed
Advertizement 1
Advertizement 2
Advertizement 3
Advertizement 4
Advertizement 5