I'm trying to create an horizontal accordion using the code below:
$(document).ready(function(){
lastBlock = $("#a1");
maxWidth = 210;
minWidth = 75;
$(".accordion_trigger").hover(function(){
$(lastBlock).animate({width: minWidth+"px"}, { queue:false,
duration:400 });
$(this).animate({width: maxWidth+"px"}, { queue:false, duration:
400});
lastBlock = this;
}
);
});
with the following HTML:
<ul class="accordion">
<li>
<span id="a1" class="accordion_trigger">
<img src="images/free_thumb.jpg" />
<p>
<strong>Freebies</strong><br/>
Download free files to make your job easier.
</p>
</span>
</li>
<li>
<span class="accordion_trigger">
<img src="images/tut_thumb.jpg" />
<p>
<strong>Tutorials</strong><br/>
Tips and tricks to help you
keep up with the latest technology.
</p>
</span>
</li>
<li>
<span class="accordion_trigger">
<img src="images/inspire_thumb.jpg" />
<p>
<strong>Inspiration</strong><br/>
Get inspired by what other designers are doing.
</p>
</span>
</li>
</ul>
The effect works well but I get this error:
handler is undefined
http://localhost:3000/javascripts/jquery.js?1236564794
Line 25
Any idea about the reason I get it?
I'm using some other scripts and plug-ins. Can it be a conflict issue?
Thanks and have a nice day
No comments:
Post a Comment