Question

i create a div dynamically and add this dynamic div into another div. i was trying to animate div and i use to add/remove class and hasclass function to have some kind of toggle function. but my code do not work properly. have a look at this portion and tell me is there any problem.

if(oDiv.hasClass('test')) {
return oDiv.animate({ opacity: 'toggle', marginTop:('-' + allChildDivHeight + 'px')    },  speed, easing, callback);
$oDiv.removeClass('test');        
    }
    else
    {

 return oDiv.animate({ opacity: 'toggle', marginTop:('-' + (margin_top+allChildDivHeight )+ 'px') }, speed, easing, callback);
 oDiv.addClass('test');

    }

can i use jquery toggle function to have this kind of effect like

$('.btnName').click(function() {
$('#panel').toggle(function() {
$(this).animate({ 
 // style change
}, 500);
},
function() {
$(this).animate({ 
 // style change back
}, 500);
});

the above code is just a sample. i just need to know can i use something like to have toggle functionality.

i wrote it like below way using toggle but still not working

oDiv.toggle(function()
{
alert('class'+allChildDivHeight );
return oDiv.animate({ opacity: 'toggle', marginTop:('-' + allChildDivHeight + 'px') }, speed, easing, callback);

},function()
{
alert('no class'+(margin_top+allChildDivHeight));
return oDiv.animate({ opacity: 'toggle', marginTop:('-' + (margin_top+allChildDivHeight )+ 'px') }, speed, easing, callback);
});

please have look at my code at top most. the full code is here http://jsfiddle.net/tridip/PTdsz/8/

please go there to see my full code and tell me why always controls goes in to this if
if(oDiv.hasClass('test')) {}

why remove class is not working like $oDiv.removeClass('test');

please help. thanks

Answer 1

You are returning before you remove the class that’s why!

Your $oDiv.removeClass('test'); is never called see:

        if(oDiv.hasClass('test')) {
        alert('class'+allChildDivHeight );
        return oDiv.animate({ opacity: 'toggle', marginTop:('-' + allChildDivHeight + 'px') }, speed, easing, callback);
        $oDiv.removeClass('test');        <------ This is never called
    }

Because you have a return in the line before.