"
Team:ETH Zurich/collapsible
From 2013.igem.org
(Difference between revisions)
| (24 intermediate revisions not shown) | |||
| Line 23: | Line 23: | ||
$(".collapsibleContainerTitle", this).click(CollapsibleContainerTitleOnClick); | $(".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() { | $(document).ready(function() { | ||
$(".collapsibleContainer").collapsiblePanel(); | $(".collapsibleContainer").collapsiblePanel(); | ||
}); | }); | ||
| + | |||
</script> | </script> | ||
| + | |||
<style type="text/css"> | <style type="text/css"> | ||
.collapsibleContainer | .collapsibleContainer | ||
{ | { | ||
| - | border: | + | border:none; |
} | } | ||
| Line 48: | Line 57: | ||
padding-top:5px; | padding-top:5px; | ||
padding-left:10px; | padding-left:10px; | ||
| - | + | color:Blue; | |
| - | + | font-size:13px; | |
} | } | ||
Latest revision as of 15:10, 25 October 2013
