javascript - Changing image in jQuery -


i new jquery , may question basic. implementing expandable panel in jquery , above have image of + when clicked panel expand. want change image - when panel expanded. want change + image - once + clicked.

below code plz help.

 <script type="text/javascript">      $(document).ready(function () {          $('#addimage').click(function () {              $('#pbody').slidetoggle('slow');          });      });  </script> 

        <asp:panel id="pbody" runat="server">             duis aute irure dolor in reprehenderit in voluptate velit             esse cillum dolore eu fugiat nulla pariatur         </asp:panel> </div> </form> 

the jquery should this:

<script type="text/javascript">      $(document).ready(function () {          $('#addimage').click(function () {              $('#pbody').slidetoggle('slow');              $(this).toggleclass('show-minus');          });      });  </script> 

and in css you'd have this:

#addimage {              background: url(plus-icon.gif);              height: 30px;              width: 30px;              cursor: pointer; } #addimage .show-minus {              background: url(minus-icon.gif); } 

and of course you're html this:

<div id="addimage"></div> 

note: if addimage tag, don't need cursor, height , width lines in css. if you'd set height/width make sure add display:block line in there too.


Comments

Popular posts from this blog

android - Spacing between the stars of a rating bar? -

html - Instapaper-like algorithm -

c# - How to execute a particular part of code asynchronously in a class -