Hi,
When u use toggle like that, it already binds a click event on the
matched elements. So, what will happen in your code is:
1. when the document is ready, it will bind a click event on
'a.toggle';
2. when u click in 'a.toggle' it will bind a click event on
'.portlet_content';
3. when u click again, it will rebind a click event on
'.portlet_content';
4. and so on...
You need to remove the click part of your code. Something like:
$('a.toggle').toggle(
function(){
$(this).parents('.portlet_topper').addClass('active');
},
function() {
$(this).parents('.portlet_topper').removeClass('active');
}
);
On Jun 22, 4:48 pm, Gercek Karakus <[email protected]> wrote:
> Hi everyone,
>
> I am having problems withToggle. You can see the jQuery and XHTML
> code below. Please let me know if you can see what's going wrong here.
>
> Thanks,
>
> $(document).ready(
> function()
> {
> $('a.toggle').click(function()
> {
>
> $(this).parents('div.portlet').children('.portlet_content').toggle
> (function(){
>
> $(this).parents('div.portlet').children('.portlet_topper').addClass
> ('active');
> },function() {
> $(this).parents('div.portlet').children
> ('.portlet_topper').removeClass('active');
> });
> });
>
> });
>
> <div class="portlet">
> <div class="portlet_topper">
> <h3>1. Most Recent Comments</h3>
> <div class="toggle-container"><a class="toggle"></a></div>
> </div>
> <div class="portlet_content">
> <p>Lorem ipsum dolor si ipiscing laoreet nibh. In hac
> habitasse platea dictumst. Aliquam erat volutpat. Cum sociis natoque
> penatibus et magnis dis parturient montes, nascetur ridiculus mus. In
> ut justo. Nulla libero.</p>
> </div>
> </div>