<script>
var docked = false;
var menu = jQuery('#dw__toc');
var init = menu.offset().top;
menu.css({
position : "fixed",
top: 50,
});
menu.addClass("toc_docked");
jQuery(window).scroll(function()
{
if (!docked && (menu.offset().top - jQuery("body").scrollTop() < 0))
{
menu.css({
position : "fixed",
top: 50,
});
menu.addClass("toc_docked");
docked = true;
}
else if(docked && jQuery("body").scrollTop() <= init)
{
menu.css({
position : "inherit",
top: init + 'px',
});
menu.removeClass("toc_docked");
docked = false;
}
});
</script>
/******************* TOC ***********************/
#dw__toc {
border:1px solid #e5e5e5;
padding: 0.5em;
border-radius:7px;
margin:1em 0.5em; max-width:300px; float:right;
h3 { padding-top:0; margin: 0; font-size:18px; line-height:20px;vertical-align:middle;text-align: center }
ul {list-style:square; margin:0 0 0 1em;padding:0;color:#aaa;}
li { padding-left: 0.7em; text-indent: -1em;}
}
.toc_docked { margin:0!important; padding:0!important;right:15px;
border:none!important;
border-radius:0!important;
background: no-repeat right top url(images/icon-bookmark.png);
}
.toc_docked h3 { margin:0; padding:0px; width:44px; height:48px; overflow:hidden; font-size:12px!important; }
.toc_docked div{display:none;}
.toc_docked:hover h3 ,.toc_docked:active h3 {color:#333; width:auto; height:auto;}
.toc_docked:hover div,.toc_docked:active div {display:block;}
.toc_docked:hover,.toc_docked:active {background-color:#F5F5F5; padding:0.5em!important; border:1px solid #e5e5e5!important;
border-top-left-radius:0em!important;
border-top-right-radius:0em!important;
border-bottom-left-radius:1em!important;
border-bottom-right-radius:1em!important;}