tips:toc_use_position_fixed
Differences
This shows you the differences between two versions of the page.
Both sides previous revisionPrevious revisionNext revision | Previous revisionLast revisionBoth sides next revision | ||
tips:toc_use_position_fixed [2010-11-21 13:58] – [TOC FIXED :!] 195.3.188.0 | tips:toc_use_position_fixed [2014-02-18 10:02] – [What we have to do] 77.87.228.67 | ||
---|---|---|---|
Line 1: | Line 1: | ||
- | ====== TOC FIXED :! ====== | + | ====== |
- | juioujbiojgo | + | |
- | dfglfp[dslgf | + | A fix position for the TOC is useful for pages with a huge count of sections/ |
- | fgkfdplkgfd' | + | |
- | ]gfdsl; | + | |
===== Some links ===== | ===== Some links ===== | ||
Everything about the fixed position of div in css and the bug off Ie 5.5 to 6, not in 7 about this argument. | Everything about the fixed position of div in css and the bug off Ie 5.5 to 6, not in 7 about this argument. | ||
- | http:// | + | * http:// |
+ | * http:// | ||
+ | * http:// | ||
- | Others ressources | + | Overflow: |
- | http:// | + | * http:// |
- | + | | |
- | http:// | + | |
- | + | ||
- | + | ||
- | Overflow : | + | |
- | + | ||
- | http:// | + | |
- | + | ||
- | http:// | + | |
===== What we want (if we want it :)===== | ===== What we want (if we want it :)===== | ||
- | We want to do the horrible tricks of the fixed div... | + | We want to do the horrible tricks of the fixed div...Why horrible? Because |
- | Why horrible | + | |
- | Look to this horrible implementation : | + | Look to this horrible implementation: |
- | [[http:// | + | |
- | The implementation of the toc in DokuWiki actually is good, it is just for special use that you can use this trick. | + | The implementation of the TOC in DokuWiki actually is good, it is just for special use that you can use this trick. |
- | ===== What we have to do===== | + | ===== What we have to do ===== |
- | Just replace | + | Just add the declaration of " |
- | For instance :\\ | + | |
- | "/dokuwiki/ | + | |
- | by this code ... | + | |
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | + | ||
- | ==== The css code ==== | + | |
<code css> | <code css> | ||
- | |||
- | /* ---------- table of contents ------------------- */ | ||
- | /* | ||
div.dokuwiki div.toc { | div.dokuwiki div.toc { | ||
- | | + | /* Netscape 4, IE 4.x-5.0/Win and other lesser browsers will use this */ |
- | float: right; | + | |
- | width: 200px; | + | |
- | font-size: 80%; | + | |
- | clear: both; | + | top: 100px; |
+ | z-index: 10; | ||
+ | width: 13%; /* could be improve */ | ||
+ | | ||
+ | overflow: hidden; /* When the toc is too big ... */ | ||
+ | opacity: 0.7; /* Transparency level of the TOC */ | ||
} | } | ||
- | |||
- | */ | ||
- | |||
- | |||
- | div.dokuwiki div.toc { | ||
- | /* Netscape 4, IE 4.x-5.0/Win and other lesser browsers will use this */ | ||
- | margin: 1.2em 0 0 2em; | ||
- | position: absolute; | ||
- | right: 2px; | ||
- | top: 100px; | ||
- | z-index: 10; | ||
- | width: 18%; /* could be improve */ | ||
- | height: 80%; | ||
- | overflow: auto; /* When the toc is too big ... */ | ||
- | |||
- | } | ||
body > div.dokuwiki div.toc { | body > div.dokuwiki div.toc { | ||
- | | + | |
- | position: fixed; | + | position: fixed; |
} | } | ||
+ | |||
<!--[if gte IE 5.5]> | <!--[if gte IE 5.5]> | ||
<![if lt IE 7]> | <![if lt IE 7]> | ||
- | |||
div.dokuwiki div.toc { | div.dokuwiki div.toc { | ||
- | | + | |
- | | + | position: absolute; |
- | right: expression( ( 20 + ( ignoreMe2 = document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft ) ) + ' | + | right: expression( ( 20 + ( ignoreMe2 = document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft ) ) + ' |
- | top: expression( ( 100 + ( ignoreMe = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop ) ) + ' | + | top: expression( ( 100 + ( ignoreMe = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop ) ) + ' |
- | z-index: 10; | + | z-index: 10; |
- | overflow-Y: | + | overflow-Y: |
} | } | ||
< | < | ||
< | < | ||
- | |||
</ | </ | ||
- | I use in the [[http:// | + | I use in the [[http:// |
<code css> | <code css> | ||
- | |||
/* Stop the web page from getting too wide */ | /* Stop the web page from getting too wide */ | ||
/* If you need to support 800x600 you'll have to reduce, or remove this */ | /* If you need to support 800x600 you'll have to reduce, or remove this */ | ||
Line 111: | Line 72: | ||
margin-right: | margin-right: | ||
} | } | ||
- | |||
- | |||
- | |||
</ | </ | ||
===== Limitations ===== | ===== Limitations ===== | ||
- | I loose my implemantation | + | I loose my implementation |
tips/toc_use_position_fixed.txt · Last modified: 2014-05-10 18:17 by 91.42.157.30