I am using xui and emile to make a collapsible panel but the first click needs a double click then all future clicks works fine on single click. I need the first click to work on single click. I also need to initially hide the list with javascript for those non javascript users.
Can anyone see where I have gone wrong?
Here is where I have extended xui
xui.extend ( {
togglePanel:function(dur,thePanel)
{
var panel = document.getElementById(thePanel);
var theHeight = document.getElementById(thePanel).scrollHeight;
if(panel.closed){
emile(panel, 'height:'+theHeight+'px',{duration:dur});
panel.closed = false;
}
else{
emile(panel, 'height:0px', {duration:dur});
panel.closed = true;
}
}
});
And this is the call and the hiding of the panel
x$(window).load(function(e){
emile('item', 'height:0px', {duration:-0});
x$('.panel a.panelItem').click(function(e){
x$().togglePanel(900,'item');})
});
I have also tried
x$('#item')setStyle ('height','0px');
to hide the content.
I have got it. Also nicked a few tweening functions from a fork of emile
xui extended
The initialisation
and some extra tweening methods from https://github.com/ded/emile
Still need to improve it a bit but we are getting there.