Deep Linking

Provides the possibility to link to a specific panel in the accordion. You can use this to have the accordion opened at a specific panel when the page loads or to load a specific panel later at a later time.

The hash that needs to be appended to the URL consists of the 'id' attribute of the accordion and the index of the panel separated by a slash character (/). For example,http://domain.com/page#my-accordion/0 will open the first panel (because panel indexes start with 0) in the accordion that has the 'id' set to 'my-accordion'.

It's also possible to specify the 'id' attribute of the panel instead of its index.

Example:

<div id="my-accordion" class="accordion-slider">
    <div class="as-panels">
        <div class="as-panel">
            <img class="as-background" src="path/to/image1.jpg"/>
        </div>
        <div id="my-panel" class="as-panel">
            <img class="as-background" src="path/to/image2.jpg"/>
        </div>
        <div class="as-panel">
            <img class="as-background" src="path/to/image3.jpg"/>
        </div>
    </div>
</div>

In order to open the second panel, you can use either http://domain.com/page#my-accordion/1or http://domain.com/page#my-accordion/my-panel .

This module is showcased in example4.html.

Have more questions? Submit a request

0 Comments

Article is closed for comments.
Powered by Zendesk