How to link a web page to another web page using which has accordion page using events and jquery
I have a index page where I want to link to a case studies pages (html) which has an accordion jquery menu nav bar driven by event triggers.
How do I link these from the index page so that when a user clicks on it will take you to the case studies page opening the relevant page in the accordion jquery section.
I have tried using this code, on the index page but this do开发者_如何学JAVAes not work.
a href="church-clock-case-studies.html" onClick="$('#test3Handle0').click()">Lyndon Hall
You will need to pass an argument to the target page. The easiest way to do so would be using the hash, i.e. make your href point to church-clock-case-studies.html#yourpage
.
In church-clock-case-studies.html you'll then use location.hash
to set the default page of the accordion. For instructions on how to set the default accordion page, have a look at the jQuery UI Accordion help.
As ThiefMaster already said, you need to pass the name of the active section you want in your accordion somehow. The easiest way to do it, as ThiefMaster also suggested, would be using a hash, as in "#argumentToBePassed" which should work in your case.
Basically you need an accordion which can identify an active state based on input provided; in this case the input is provided through the URL hash.
For a detailed walkthrough of this method (and more), you might want to check out http://www.michaeljacobdavis.com/tutorials/statesavingaccordion.html which I found very helpful.
You need to do this:
Assuming you are using the accordion widget in JQuery UI, set the "navigation" parameter to "true" in your call to accordion() like so;
$("#yourAccordion").accordion({navigation:true});//while initializing accordion
or
$("#yourAccordion").accordion("option", "navigation" ,true);//set it later in the script
Say, you want link3 on homepage to open #section3 in your accordion, mark up the section3 "container element" on the target page(church-clock-case-studies.html) with id="section3". Also, point your header link in your accordion to "#section3".
Make your link3 on homepage point to church-clock-case-studies.html#section3 .
That should do it for you. Although, I have tested it in a different scenario where I need to preserve the state of currently open section of accordion on loading another page with the same accordion, and make the accordion sections' states "bookmark-able" (latter is what you want, I think). Hope that helps. :)
精彩评论