html - jQuery hide/show code not working in Internet Explorer -
why below piece of code work in chrome , firefox not ie? how prepare this?
there no outputted errors can see.
relevant jquery
<script> $(document).ready(function(){ $(".slidingdiv").hide(); $(".show_hide").show(); $('.show_hide').click(function(){ $(".slidingdiv").hide(); $(this).parent().next(".slidingdiv").slidetoggle(); }); }); </script> relevant html
<ul class="relatedinfolinks"> <li><a class="drop show_hide" href="#drop">what new parts? </a> <ul class="slidingdiv"> <li>casr part 61 – flight crew licensing requirements</li> <li>casr part 64 – authorisations non-licenced personnel operate aeronautical radio , taxi aircraft. </li> <li>casr part 141 – airplane pilot flight training other integrated training</li> <li>casr part 142 – integrated , multi crew airplane pilot flight training </li> </ul> </li> <li><a class="drop show_hide" href="#drop">where can find new regulations?</a> <ul class="slidingdiv"> <li>the regulations housed on com law website , can accessed through links on casa home page. </li> </ul> </li> <li><a class="drop show_hide" href="#drop">why casa introducing these new regulations?</a> <ul class="slidingdiv"> <li>align international civil aviation organization standards , recommended practices (making licences more transportable our crews , benefitting local training institutions attracting foreign pilots train in australia),</li> <li>strengthen licensing , training requirements through introduction of multi-crew training , flight testing air transport licences (those required undertake passenger services) , increased requirements co-pilots,</li> <li>improved standards training organisations strong focus on flight activity , aircraft specific competency , need greater organisational planning through requirement safety , quality assurance systems,</li> <li>better alignment modern vocational education , training requirements centred on structured , competency-based training, delivered competent , qualified instructors , assessed against defined standards, and</li> <li>address australian transport safety bureau recommendations through introducing requirements ratings low level flying , additional requirements night time visual flying.</li> </ul> </li> <li><a class="drop show_hide" href="#drop">is compliance regulations required today?</a> <ul class="slidingdiv"> <li>the regulations commence on 4 dec 2013, hence no immediate action required aviation industry. </li> <li>during period casa developing communication , education material, building processes, amending casa procedures manuals , developing guidance material (sample expositions, acceptable means of compliance etc.) utilize industry. <ul> <li>current flight crew license holders transitioned new part 61 licence scheme on 4 year period. </li> <li>current flight crew training organisations allowed 3 years comply additional requirements of part 141 , 142.</li> </ul></li> <li>for existing licence holders licence hold on 3 dec still meet requirements on 4 december.</li> </ul> </li> <li><a class="drop show_hide" href="#drop">what happening before 4 december?</a> <ul class="slidingdiv"> <li>in transition period casa farther developing industry advisory material , delivery training , education key industry members facilitating implementation , transition. </li> </ul> </li> <li><a class="drop show_hide" href="#drop">what if want know more? </a> <ul class="slidingdiv"> <li>more detailed info can found on casa website xxxxxxx , can sign received updates on transition new regulations. </li> </ul> </li> </ul> whole code (source browser)
<!doctype html public "-//w3c//dtd xhtml 1.0 transitional//en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" /> <title>licencing regulations</title> <link href="/_lib/styles/text.css" rel="stylesheet" type="text/css" media="screen, print" /> <link href="/_lib/styles/print.css" rel="stylesheet" type="text/css" media="print" /> <style type="text/css" media="screen"> @import url("/_lib/styles/layout_menu.css"); </style> <!--[if gte ie 5.5]> <style type="text/css" media="screen">@import url("/_lib/styles/ie.css");</style> <![endif]--> <script type="text/javascript"> var _gaq = _gaq || []; _gaq.push(['_setaccount', 'ua-8070993-4']); _gaq.push(['_setdomainname', 'none']); _gaq.push(['_setallowlinker', true]); _gaq.push(['_trackpageview']); (function() { var ga = document.createelement('script'); ga.type = 'text/javascript'; ga.async = true; ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js'; var s = document.getelementsbytagname('script')[0]; s.parentnode.insertbefore(ga, s); })(); </script> <script type="text/javascript" src="/_lib/scripts/jquery-1.6.4.js"></script> </head> <body id="seclvl"> <div id="bg"> <div id="wrapper"> <div id="header" class="overflow"> <a href="/index.htm" class="logo">casa connect</a> <div class="search"> <form action="http://act01int013/search/search.cgi" method="get"> <div class="inputbox"> <label for="search">search</label> <input type="text" name="query" size="20" value="" /> <input type="hidden" name="collection" value="casaconnect" /> <input type="hidden" name="form" value="simple" /> </div> <input type="image" name="search2" src="/_lib/images/btn_go.gif" class="btn" /> </form> <div class="user"><strong>hi, <a href="/mylinks/?pagetitle=licencing regulations">test site user</a></strong><br /> 20/02/2013 12:12:06</div> </div> <!-- end search div --> </div> <!-- end header div --> <div class="menu"> <ul> <li class="ourorganisation"><a class="hide" href="/organisation/index.htm">our organisation</a> <ul> <li><a href="/organisation/about/index.htm">about us</a></li> <li><a href="/organisation/messages/index.htm">director/deputy director messages</a></li> <li><a href="/organisation/reports/index.htm">reports</a></li> <li><a href="/organisation/committees/index.htm">committees & meetings</a></li> </ul> </li> <li class="casasystems"><a class="hide" href="/systems/index.htm">casa systems</a> <ul> <li><a href="/systems/ess/index.htm">aurion ess</a></li> <li><a href="/systems/trim/index.htm">trim</a></li> <li><a href="/systems/airs/index.htm">airs</a></li> <li><a href="/systems/fmis/index.htm">fmis (peoplesoft)</a></li> <li><a href="/systems/fmis/index_new.htm">fmis (techone)</a></li> <li><a href="/systems/eap/index.htm">eap</a></li> <li><a href="/systems/fcat/index.htm">fcat</a></li> <li><a href="/working/travel/index.htm">travel</a></li> <li><a href="/systems/servicelog/timelog_help/index.htm">timelog</a></li> <li><a href="/systems/bo/index.htm">sap businessobjects</a></li> <li><a href="/yourarea/odas/pmb/services/bcs.htm">how inquire scheme enhancement?</a></li> </ul> </li> <li class="staffhandbook"><a class="hide" href="/working/index.htm">working @ casa</a> <ul> <li><a href="/working/iwantto/index.htm">i want know ...</a></li> <li><a href="/hr/index.htm">human resources</a></li> <li><a href="/working/newtocasa/index.htm">new starters</a></li> <li><a href="/jobs/index.htm">careers @ casa</a></li> <li><a href="/yourarea/odas/commservices/index.htm">communication in casa </a></li> <li><a href="/working/travel/index.htm">travel</a></li> <li><a href="/working/property/index.htm">property & security</a></li> <li><a href="/working/awards/index.htm">employee awards</a></li> </ul> </li> <li class="itinformation"><a class="hide" href="/it/index.htm">it centre</a> <ul> <li><a href="/it/general/index.htm">general help</a></li> <li><a href="/it/computers/index.htm">computers</a></li> <li><a href="/it/email/index.htm">email</a></li> <li><a href="/it/printers/ricoh/index.htm">photocopiers/printers</a></li> <li><a href="/it/phones/index.htm">phones</a></li> <li><a href="/it/applications/index.htm">application support</a></li> <li><a href="/it/videoconf/index.htm">video conference</a></li> <li><a href="/yourarea/isg/web/web.htm">web content</a></li> <li><a href="/it/unified-comms/unified-communications.htm">unified communications</a></li> </ul> </li> <li class="whatshappening"><a class="hide" href="/happening/index.htm">what's happening</a> <ul> <li><a href="/happening/clippings/index.htm">media & paper clippings</a></li> <li><a href="/happening/noticeboard/index.htm">noticeboard</a></li> <li><a href="/happening/socialclub/index.htm">social club</a></li> <li><a href="/happening/holidays.htm">public holidays</a></li> <li><a href="/happening/newsletters/index.htm">publications/newsletters</a></li> </ul> </li> <li class="training"><a class="hide" href="/training/index.htm">training</a> <ul> <li><a href="/training/courses/schedule.htm">course schedule</a></li> <li><a href="/training/class/class.htm">class</a></li> <li><a href="/training/courses/internal.htm">internal courses</a></li> <li><a href="/training/courses/external.htm">external courses</a></li> <li><a href="/training/leadership.htm">leadership & management development</a></li> <li><a href="/training/reg_tech.htm">regulatory & technical training</a></li> <li><a href="/training/on-the-job-training.htm">on-the-job training program</a></li> <li><a href="/training/policy.htm">safety education policies</a></li> </ul> </li> <li class="casawary"><a class="hide" href="/casawary/index.htm">casawary</a> <ul> <li><a href="/casawary/current/index.htm">current issue</a></li> <li><a href="/casawary/archive.htm">past issues</a></li> <li><a href="/casawary/search.htm">search articles</a></li> </ul> </li> </ul> </div> <div class="twocolumn"> <p class="breadcrm"><a href="/index.htm">home</a></p> <img src="/_lib/images/menu/processes.gif" alt="" width="891" /> <div class="twocolumnrow"> <div class="twocolumncontent"> <div class="contentpad"> <!-- start of main content --> <h1>licencing regulations</h1> <h2>key information</h2> <p>must-know facts</p> <ul class="relatedinfolinks"> <li><a href="http://www.casa.gov.au/scripts/nc.dll?wcms:standard::pc=pc_101335">part 61 flight crew licensing</a> <ul><li class="level2"><a href="http://www.casa.gov.au/scripts/nc.dll?wcms:standard::pc=pc_101339">part 61 impact on industry</a></li></ul></li> <li><a href="http://www.casa.gov.au/scripts/nc.dll?wcms:standard::pc=pc_101336">part 64 authorisations non-licensed personnel</a> <ul><li class="level2"><a href="http://www.casa.gov.au/scripts/nc.dll?wcms:standard::pc=pc_101340">part 64 impact on industry</a></li></ul></li> <li><a href="http://www.casa.gov.au/scripts/nc.dll?wcms:standard::pc=pc_101337">part 141 airplane pilot flight training other integrated training</a> <ul><li class="level2"><a href="http://www.casa.gov.au/scripts/nc.dll?wcms:standard::pc=pc_101341">part 141 impact on industry</a></li></ul></li> <li><a href="http://www.casa.gov.au/scripts/nc.dll?wcms:standard::pc=pc_101338">part 142 integrated , multi crew airplane pilot flight training</a> <ul><li class="level2"><a href="http://www.casa.gov.au/scripts/nc.dll?wcms:standard::pc=pc_101342">part 142 impact on industry</a></li></ul></li> </ul> <h2>key resources</h2> <ul class="relatedinfolinks"> <li><a href="/junk/cao/doc/fm_bulletin_2_print.pdf">standards info on casa website</a></li> <li><a href="/junk/cao/doc/fm_bulletin_2.pdf">external info on casa website </a></li> </ul> <h2>contact us</h2> <ul class="relatedinfolinks"> <li><a href="#">project staff</a></li> </ul> <h2>must-know facts</h2> <ul class="relatedinfolinks"> <li><a class="drop show_hide" href="#drop">what new parts? </a> <ul class="slidingdiv"> <li>casr part 61 flight crew licensing requirements</li> <li>casr part 64 authorisations non-licenced personnel operate aeronautical radio , taxi aircraft. </li> <li>casr part 141 airplane pilot flight training other integrated training</li> <li>casr part 142 integrated , multi crew airplane pilot flight training </li> </ul> </li> <li><a class="drop show_hide" href="#drop">where can find new regulations?</a> <ul class="slidingdiv"> <li>the regulations housed on com law website , can accessed through links on casa home page. </li> </ul> </li> <li><a class="drop show_hide" href="#drop">why casa introducing these new regulations?</a> <ul class="slidingdiv"> <li>align international civil aviation organization standards , recommended practices (making licences more transportable our crews , benefitting local training institutions attracting foreign pilots train in australia),</li> <li>strengthen licensing , training requirements through introduction of multi-crew training , flight testing air transport licences (those required undertake passenger services) , increased requirements co-pilots,</li> <li>improved standards training organisations strong focus on flight activity , aircraft specific competency , need greater organisational planning through requirement safety , quality assurance systems,</li> <li>better alignment modern vocational education , training requirements centred on structured , competency-based training, delivered competent , qualified instructors , assessed against defined standards, and</li> <li>address australian transport safety bureau recommendations through introducing requirements ratings low level flying , additional requirements night time visual flying.</li> </ul> </li> <li><a class="drop show_hide" href="#drop">is compliance regulations required today?</a> <ul class="slidingdiv"> <li>the regulations commence on 4 dec 2013, hence no immediate action required aviation industry. </li> <li>during period casa developing communication , education material, building processes, amending casa procedures manuals , developing guidance material (sample expositions, acceptable means of compliance etc.) utilize industry. <ul> <li>current flight crew license holders transitioned new part 61 licence scheme on 4 year period. </li> <li>current flight crew training organisations allowed 3 years comply additional requirements of part 141 , 142.</li> </ul></li> <li>for existing licence holders licence hold on 3 dec still meet requirements on 4 december.</li> </ul> </li> <li><a class="drop show_hide" href="#drop">what happening before 4 december?</a> <ul class="slidingdiv"> <li>in transition period casa farther developing industry advisory material , delivery training , education key industry members facilitating implementation , transition. </li> </ul> </li> <li><a class="drop show_hide" href="#drop">what if want know more? </a> <ul class="slidingdiv"> <li>more detailed info can found on casa website xxxxxxx , can sign received updates on transition new regulations. </li> </ul> </li> </ul> <!-- end of main content --> </div> <!-- end contentpad div --> </div> <!-- end twocolumncontent div --> <div class="twocolumnlinks"> <div class="quicklinks"> <h3>quick links</h3> <br /> <ul> <li><a href="http://ess">staff directory</a></li> <li><a href="/tools/index.htm">tools of trade</a></li> <li><a href="/forms/index.htm">forms</a></li> <li><a href="/guidance/index.htm">workplace guidance</a></li> <li><a href="/yourarea/index.htm">your area</a></li> <li><a href="/offices/index.htm">casa offices</a></li> </ul> </div> <div class="mylinkssub"> <h3><strong>my</strong> links</h3> <ul> <li><a href='http://casa.gov.au/'>casa.gov.au</a></li> <li><a href='/forms/'>forms</a></li> <li>custom link 3</li> <li>custom link 4</li> <li>custom link 5</li> <li>custom link 6</li> <li>custom link 7</li> <li>custom link 8</li> </ul> <a href="/mylinks/?pagetitle=licencing regulations" class="addmylinks">edit <strong>my</strong> links</a> </div> </div> <!-- end twocolumnlinks div --> </div> <!-- end twocolumnrow div --> <script type="text/javascript"> $(document).ready(function(){ $(".slidingdiv").hide(); $(".show_hide").show(); $('.show_hide').click(function(){ $(".slidingdiv").hide(); $(this).parent().next(".slidingdiv").slidetoggle(); }); }); </script> </div> <!-- end twocolumn div --> <div id="footer"> <ul> <li class="first"><strong>© copyright 2013 casa</strong></li> <!--<li><a href="/footer/update.htm">casaconnect updates</a></li>--> <li><a href="mailto:webmaster@casa.gov.au">webmaster@casa.gov.au</a></li> <li><a href="/footer/privacy.htm">privacy policy</a></li> <li class="last"><a href="/footer/sitemap.htm">site map</a></li> </ul> </div> <!-- end footer div --> </div> <!-- end wrapper div --> </div> <!-- end bg div --> <!--the next jquery code tracks pdf files --> <script type="text/javascript"> jquery(function() { jquery('a[href$=".pdf"]').click(function() { _gaq.push(['_trackevent', 'download', 'pdf', this.href]); }) }); </script> </body> </html>
your html code invalid:
<a id="drop" class="show_hide" href="#drop"> ... <a id="drop" class="show_hide" href="#drop"> ... it's not working because you've duplicated id called drop. each id must unique on page or browser rendering becomes unpredictable. explains why no jquery/javascript errors, nil works. duplicate id's discarded dom , jquery fails find elements.
only utilize unique id's on page, or seek changing class instead:
<a class="show_hide drop" href="#drop"> ... working demo: http://jsfiddle.net/yfa32/
edit:
your html still invalid , that's causing jquery dom traversal fail in explorer...
<ul class="relatedinfolinks"> <li>...</li> <div class="slidingdiv"> ... </div> <li>...</li> <div class="slidingdiv"> ... </div> </ul> you cannot have <div> immediate descendants of <ul>... as per spec, <li> can immediate descendants of <ul>. alter these div's li's.
newly updated jsfiddle: http://jsfiddle.net/yfa32/1/
validated html step 1 before chasing cross-browser issues, explorer issues.
edit 2:
since fixing html validation errors have not solved op's problem, think .toggle() trying open , closes element due interference preceding .hide().
anyway, refactoring code makes little more sense , operates more smoothly without of previous blinking. utilize .not() exclude current target of click leaves part .toggle() evaluate.
i utilize similar myself , works fine in explorer...
$(document).ready(function () { $(".slidingdiv").hide(); $('.show_hide').click(function () { var ele = $(this).parent().next('.slidingdiv'); //<-- target $('.slidingdiv').not(ele).slideup(); //<-- closes else except target ele.slidetoggle(); //<-- toggles target }); }); demo: http://jsfiddle.net/yfa32/6/
jquery html internet-explorer
No comments:
Post a Comment