I used the hide/show element not so much for navigation,
Hide/Show Element"The hide/show element allows a portion of the page contents to toggle between hidden or shown. There are multiple valid locations where hide/show can be used.
from www.oracle.com
Here are the steps involved. It has three parts. First you must enter the following code in your style sheet:
.commenthidden {display:none}Second put this between the <head> and </head> tags, but not in the style sheet:
.commentshown {display:inline}
<script type="text/Javascript">Third put this in your sidebar where you want it to appear:
function togglecomments (postid) {
var whichpost = document.getElementById(postid);
if (whichpost.className=="commentshown") { whichpost.className="commenthidden"; } else { whichpost.className="commentshown"; }
} </script>
<a aiotitle="click to expand" href="javascript:togglecomments('UniqueName')"
>Title</a><br />
<div class="commenthidden" id="UniqueName"
></div>
This is what my code looks like:
<a aiotitle="click to expand" href="javascript:togglecomments('chickletlist')">I love Chicklets...+/-</a><br /><br>The UniqueName had me puzzled but CptCanuck explained that it had to be a name that was 'unique' from any other in my template. So, I called it chickletlist. Next give it a title. I chose I love Chicklets...+/-. The actual link is placed between the <div></div> elements. You may add links until you feel the need to move on.
<div class="commenthidden" id="chickletlist">
<a title="Blogger Forum, the Blogging community" target="_blank" href="http://www.bloggerforum.com/">
<img border="0" src="http://www.bloggerforum.com/images/bf5.gif" width="80" height="15"></a>
</div>
Edit 5/24/06: Today I saw a post over at Freshblog that discusses the Hide/Show hack. Somehow by reading different links, I ended up at Singpolyma - Technical Blog and saw an awesome example of using Hide/Show for the whole sidebar!
Also see: Blogger Beta: Hide/Show, Expand/Collapse Labels
No comments:
Post a Comment