jQuery collapsible panel (my own) problems -


I am trying to create a jQuery open panel, and plug-ins are all around for this, but let me I do not really get what I want, I'm trying to roll myself using my various examples. Although it works for the most part, there is a bit which does not and why can not I.

(An example page is)

How it works (or it

HTML

  

javascript

  (function ($) {$ .fn. Extend ({CollapsiblePanel: function () {return $ (this) .each (initCollapsiblePanel);}});}); Function int callspible panel (if ($ (this). Child (). Length = = 0) {$ (this) .wrapInner ("
");} $ (this) .Kids (wrap) all ("& lt; div class = 'Cpa $ ("Nelcontent '& gt; & lt; / div & gt;"); $ ("& lt; div class =' ​​cpanelTitle '" & gt; "$ (this) .attr (" title "

css

  # container {width: 300px; Height: 300px; }. CollapsiblePanel {width: 100%; }. CpanelTitle {Status: Relative; Width: 100%; Cursor: indicator; Cursor: hand; }. Cpanel toggle {status: absolute; Top: 0px; Correct: 0px; Font-style: italic; }   

Then it takes a div with square collapsiblePanel and creates various nested divs. The header has a title and some toggle text that will be 'more' or 'off' depending on whether the content panel is extended or concise or not.

That which does not work is bit

  if ($ (".cpanelcontent", $ (this) .Parent ()). (": Hidden" )) {  

The toggleCollapsiblePanel () function has a div toggle, it seems that I am selecting the content div right, but to find out whether it is hidden or not (hence I can change the text of cPanelToggleDiv) always back in false form - which indicates that I'm not just doing it correctly.

I tried and saw that there is a console call (in the example page of the above link), but it can not be seen right now.

hide you Status should be checked in the slideToggle callback method. Unless the slide animation is complete, you can not say whether it is hidden or not

toggle the function CollapsiblePanel ($. ($.) {$ (".cpanelcontent", $ (this) .Parent ()) Slide Toggle (function () {if ($ (this) .is (": hidden")) (This) .html ('more');} and {$ (this) .html ('off');}})}}

Comments

Popular posts from this blog

mysql - BLOB/TEXT column 'value' used in key specification without a key length -

c# - Using Vici cool Storage with monodroid -

python - referencing a variable in another function? -