responsive

Links

Table of contents:

Types of links

Demonstration of the below described types of links.

Loading content...

Multiple links

There are many links inside this slide

You can place as many links as you want inside a slide in case the slide is not link. See, I'm link. So am I and me too.

slide2

Only image is link

Click me, I'm not link

slide3

No link here

slide4

No link here

slide5

A slide can contain 1 or more links but only links of fully open slide are enabled (by default), i.e. if you click link of non-fully open slide nothing happens.

Slide as link

Link is wrapped around the whole content of a slide. There cannot be any other links inside this slide.

Example of a link wrapped around the whole content of a slide:

<div class="jAccordion-slide">
	<a href="http://google.com">
	  	<img src="images/img1.png" width="910" height="380" alt="some alternative text" />
		<div class="description">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</div>
	</a>
</div>

Multiple links

A slide can contain multiple non-colliding links.

Example of a slide containing multiple links:

<div class="jAccordion-slide">
	<img src="images/img1.png" width="910" height="380" alt="some alternative text" />
	<div class="description">Lorem ipsum dolor sit amet <a href="http://google.com">Link 1</a>, consectetur adipiscing elit <a href="http://google.com">Link 2</a>.</div>
</div>

Links always enabled

As mentioned previously all links of non-open slides are disabled by default, which means that nothing happens when you click them but there is of course possibility to keep all links of all slides or just particular links enabled using additional class.

All links always enabled

Class jAccordion-keepLinksEnabled has to be added to jAccordion container to keep all links always enabled.

Example of accordion with always enabled links:

<div class="accordion noJS jAccordion-keepLinksEnabled">	<!--Class "jAccordion-keepLinksEnabled" specifies that all links are always enabled-->
	<div class="jAccordion-slidesWrapper">
		<div class="jAccordion-slide"><!--Content of slide1 - all links inside this slide are always enabled--></div>
		<div class="jAccordion-slide"><!--Content of slide2 - all links inside this slide are always enabled--></div>
		<div class="jAccordion-slide"><!--Content of slide3 - all links inside this slide are always enabled--></div>
		<div class="jAccordion-slide"><!--Content of slide4 - all links inside this slide are always enabled--></div>
	</div>
</div>

Particular links always enabled

Class jAccordion-keepEnabled has to be added to a link to keep the link always enabled.

Example of a slide containing a link which is always enabled:

<div class="jAccordion-slide">
	<a href="http://google.com" target="_blank" class="jAccordion-keepEnabled">	<!--Class "jAccodion-keepEnabled" specifies that this link is always enabled-->
		<img src="images/img1.png" width="910" height="380" alt="some alternative text" />
	</a>
</div>

jAccordion by maniacpc, exclusively for CodeCanyon