Showing posts with label Blogger Tab Template Widgets. Show all posts
Showing posts with label Blogger Tab Template Widgets. Show all posts

Thursday, June 19, 2008

Blogger Blogspot Pages scroll too much

OK, so, I just realized it's entirely possible some people have absolutely no idea why I went to the effort of making the posts script and the sidebar widget. It's simple really, when I read other peoples' blogs I find myself scrolling around like crazy. I hate scrolling, so I decided to come up with a solution to the problem rather than just complain about it.

Now, on this blog, you'll likely still do some scrolling (especially on long posts); however, you won't do as much with the navigation scripts place. It's kind of like tab-navigation for your blog.

http://blog.benfinnigan.com/2008/06/blog-post-navigation-script.html

http://blog.benfinnigan.com/2008/06/interesting-sidebar-widget.html

Blog Post Navigation Widget

I went ahead and tweaked out my sidebar navigation code to provide similar functionality for blog posts.

Here's the code:

<!-- BlogPostNav Widget By Benfinnigan.com /-->
<style type="text/css">
.postnavbutton {
cursor: pointer;
cursor: hand;
margin: 1px;
padding: 2px;
background-color: #ffffff;
color: #000000;
border-style: solid;
border-width: 1px 2px 2px 1px;
border-color: #C0C0C0 #000000 #000000 #C0C0C0;
}
.postnavbutton:hover
{
cursor: pointer;
cursor: hand;
margin: 1px;
padding: 2px;
background-color: #dddddd;
color: #000000;
border-style: solid;
border-width: 2px 1px 1px 2px;
border-color: #000000 #C0C0C0 #C0C0C0 #000000;
}
</style>
<script src="http://benfinnigan.com/js/blogpostnav.js" type="text/javascript"></script>
<!-- End BlogPostNav Widget By Benfinnigan.com /-->

Please give me a link back if you swipe the code and please let me know if you find errors.

Sidebar Navigation Widget



So, I just finished up a little sidebar navigation widget that helps de-clutter the ole blog.

Here's the code:

<!-- Sidebar Nav Widget By Benfinnigan.com /-->
<style type="text/css">
.sidebarnavbutton {
cursor: pointer;
cursor: hand;
margin: 1px;
padding: 2px;
background-color: #ffffff;
color: #000000;
border-style: solid;
border-width: 1px 2px 2px 1px;
border-color: #C0C0C0 #000000 #000000 #C0C0C0;
}
.sidebarnavbutton:hover
{
cursor: pointer;
cursor: hand;
margin: 1px;
padding: 2px;
background-color: #dddddd;
color: #000000;
border-style: solid;
border-width: 2px 1px 1px 2px;
border-color: #000000 #C0C0C0 #C0C0C0 #000000;
}
</style>
<script type="text/javascript">
//<!--
var sidebarid = 'sidebar';
var widgetClassPrefix = 'widget ';
var widgetClassDisqualifier = 'draggable-widget';
var blnsidebaraccordion = true;
// /-->
</script>
<script src="http://benfinnigan.com/js/sidebarnav.js" type="text/javascript"></script>
<!-- End Sidebar Nav Widget By Benfinnigan.com /-->

To add the sidebar navigation widget to your blog follow these steps:



If you play with it, please give me a link on your blog somewhere. If you find errors, please feel free to post a comment.