Team:Toulouse/template/Accordion
From 2014.igem.org
(Difference between revisions)
(4 intermediate revisions not shown) | |||
Line 56: | Line 56: | ||
.openlanguage{ /*class added to contents of 2nd demo when they are open*/ | .openlanguage{ /*class added to contents of 2nd demo when they are open*/ | ||
color: green; | color: green; | ||
+ | } | ||
+ | |||
+ | .openlanguage2{ /*class added to contents of 2nd demo when they are open*/ | ||
+ | color:#5a6060; | ||
} | } | ||
Line 61: | Line 65: | ||
color: #225e22; | color: #225e22; | ||
} | } | ||
+ | |||
+ | .closedlanguage2{ /*class added to contents of 2nd demo when they are closed*/ | ||
+ | color:#5a6060; | ||
+ | } | ||
+ | |||
</style> | </style> | ||
Line 95: | Line 104: | ||
ddaccordion.init({ | ddaccordion.init({ | ||
headerclass: "technology2", //Shared CSS class name of headers group | headerclass: "technology2", //Shared CSS class name of headers group | ||
- | contentclass: " | + | contentclass: "thelanguage2", //Shared CSS class name of contents group |
revealtype: "click", //Reveal content when user clicks or onmouseover the header? Valid value: "click", "clickgo", or "mouseover" | revealtype: "click", //Reveal content when user clicks or onmouseover the header? Valid value: "click", "clickgo", or "mouseover" | ||
mouseoverdelay: 200, //if revealtype="mouseover", set delay in milliseconds before header expands onMouseover | mouseoverdelay: 200, //if revealtype="mouseover", set delay in milliseconds before header expands onMouseover | ||
Line 103: | Line 112: | ||
animatedefault: false, //Should contents open by default be animated into view? | animatedefault: false, //Should contents open by default be animated into view? | ||
persiststate: false, //persist state of opened contents within browser session? | persiststate: false, //persist state of opened contents within browser session? | ||
- | toggleclass: [" | + | toggleclass: ["closedlanguage2", "openlanguage2"], //Two CSS classes to be applied to the header when it's collapsed and expanded, respectively ["class1", "class2"] |
togglehtml: ["suffix", " <small><small>[Expand]</small></small>", " <small><small>[Collapse]</small></small>"], //Additional HTML added to the header when it's collapsed and expanded, respectively ["position", "html1", "html2"] (see docs) | togglehtml: ["suffix", " <small><small>[Expand]</small></small>", " <small><small>[Collapse]</small></small>"], //Additional HTML added to the header when it's collapsed and expanded, respectively ["position", "html1", "html2"] (see docs) | ||
animatespeed: "fast", //speed of animation: integer in milliseconds (ie: 200), or keywords "fast", "normal", or "slow" | animatespeed: "fast", //speed of animation: integer in milliseconds (ie: 200), or keywords "fast", "normal", or "slow" |
Latest revision as of 14:26, 17 October 2014