"
Team:ETH Zurich/collapsible
From 2013.igem.org
(Difference between revisions)
| (15 intermediate revisions not shown) | |||
| Line 21: | Line 21: | ||
// Assign a call to CollapsibleContainerTitleOnClick for the click event of the new title div. | // Assign a call to CollapsibleContainerTitleOnClick for the click event of the new title div. | ||
| - | $(".collapsibleContainerTitle", this). | + | $(".collapsibleContainerTitle", this).click(CollapsibleContainerTitleOnClick); |
} | } | ||
| - | |||
function CollapsibleContainerTitleOnClick() { | function CollapsibleContainerTitleOnClick() { | ||
// The item clicked is the title div... get this parent (the overall container) and toggle the content within it. | // The item clicked is the title div... get this parent (the overall container) and toggle the content within it. | ||
$(".collapsibleContainerContent", $(this).parent()).slideToggle(); | $(".collapsibleContainerContent", $(this).parent()).slideToggle(); | ||
| + | |||
| + | strBefore = "collapse"; | ||
| + | str = "expand"; | ||
| + | if ($(this).children('.collapsibleContainerTitle div').html().indexOf("expand") >= 0) | ||
| + | { | ||
| + | str = [strBefore, strBefore = str][0]; | ||
| + | } | ||
| + | $(this).children('.collapsibleContainerTitle div').html($(this).children('.collapsibleContainerTitle div').html().replace(strBefore, str)); | ||
} | } | ||
| + | $(document).ready(function() { | ||
| + | $(".collapsibleContainer").collapsiblePanel(); | ||
| + | }); | ||
</script> | </script> | ||
| Line 34: | Line 44: | ||
.collapsibleContainer | .collapsibleContainer | ||
{ | { | ||
| - | border | + | border:none; |
} | } | ||
| Line 47: | Line 57: | ||
padding-top:5px; | padding-top:5px; | ||
padding-left:10px; | padding-left:10px; | ||
| - | color: | + | color:Blue; |
| + | font-size:13px; | ||
} | } | ||
Latest revision as of 15:10, 25 October 2013
