Search jQuery

jQuery Forum

Developing jQuery Plugins

paula.c

Vertical Sliding Accordion effect

in Developing jQuery Plugins • 11 years ago

Hello, my name is Paula and I have basic notions of jquery.

I am working with a plugin called Vertical Sliding Accordion.

The code it uses is:

$(function() {

$('#va-accordion').vaccordion({

expandedHeight : 500,

animSpeed : 400,

accordionH : 770,

animOpacity : 0.3,

visibleSlices : 18

});

and the html structure is:

<div id="va-accordion" class="va-container">
	<div class="va-nav"><span class="va-nav-prev">Previous</span>
	<span class="va-nav-next">Next</span></div>
	<div class="va-wrapper">
	<div class="va-slice">
	<h3 class="va-title">Natureza Urbana: São Paulo</h3>
	<div class="va-content">
	<p><img width="400" height="280" alt="" src="../images/small/NatUrbSmall.jpg" /><br />Public space landscape project<br />
	São Paulo, Brazil<br />
	In collaboration with: Bijarí</p>
	<ul>
	<li><a target="_parent" href="Natureza-Urbana.html">More details</a></li>
	</ul>
	</div>
	</div>
	<div class="va-slice">
	<h3 class="va-title">Op Wereldreis met Pit</h3>
	<div class="va-content">
	<p><img width="400" height="280" alt="" src="../images/small/PietSmall.jpg" /><br />Activity book and event for children<br />
	Poelenburg, Zandaam. The Netherlands<br />
	In collaboration with: Saron Paz, Kelly de Meyer</p>
	<ul>
	<li><a target="_parent" href="Op-wereldreis-met-Piet.html">More details</a></li>
	</ul>
	</div>
	</div> .... and so on So I have nested divs, each with a va-title and va-content class. I have managed to make it work fine so far but there is one effect I want to do and cannot find the way, I hope you can help me. I would like to make all my va-title clases overlay on each other when my accordion is closed and when the slices are collapsed. I have tried to do it bringing them close (making my accordion height shorter) and making all my CSS backgrounds transparent, but no matter what I do, they cut each other istead of mixing. This is the link I am working on: http://www.josesubero.com/html/Jose-Subero-Work.html Any ideas are very welcome. Thank you very much Best Paula

Response title

Attachments

jQuery Forum

Vertical Sliding Accordion effect

Statistics

Tags

Actions