JavaScript Programming JavaScript > Code Examples accordion panel open/close event accordion panel open/close event <!doctype html> <html lang="en"> <head> <title>Happy Codings :-) C++, C#, HTML, Java, JavaScript Code Examples</title> <link type="text/css" href="js/themes/base/ui.all.css" rel="stylesheet" /> <script type="text/javascript" src="js/jquery-1.3.2.js"></script> <script type="text/javascript" src="js/ui/ui.core.js"></script> <script type="text/javascript" src="js/ui/ui.accordion.js"></script> <link type="text/css" href="js/demos.css" rel="stylesheet" /> <script type="text/javascript"> $(function() { var accOpts = { //add change event callback change: function(e, ui) { alert($(ui.newContent).attr("id") + " was opened, " + $(ui.oldContent).attr("id") + " was closed"); } }; $("#myAccordion").accordion(accOpts); }); </script> </head> <body> <div id="myAccordion"> <h3><a class="heading" href="#">Section 1</a></h3> <div> <p>A true man does not need to romance a different girl every night, <br /> a true man romances the same girl for the rest of her life. <br /> <br /> <b>Ana Alas</b> </p> </div> <h3><a class="heading" href="#">Section 2</a></h3> <div> <p> Love and electricity are one in the same, my dear. <br /> If you do not feel the jolt in your soul every time a kiss is shared, <br /> a whisper is spoken, a touch is felt, then you are not really in love at all. <br /> <br /> <b>C.J. Franks</b> </p> </div> <h3><a class="heading" id="header3" href="#">Section 3</a></h3> <div> <p> In real love you want the other person's good. <br /> In romantic love, you want the other person. <br /> <br /> <b>Margaret Anderson</b> </p> <ul> <li>List item one</li> <li>List item two</li> <li>List item three</li> </ul> </div> <h3><a class="heading" href="#">Section 4</a></h3> <div> <p> Love grows by giving. <br /> The love we give away is the only love we keep. <br /> The only way to retain love is to give it away. <br /> <br /> <b>Elbert Hubbard</b> </p> </div> </body> </html>
