Hi,
i found this usefull script for scrolling pages up completely by clicking to an image
that appears after scrolling the page down.
Demo: http://www.dynamicdrive.com/dynamicindex3/scrolltop.htmYoutube / Video: http://www.youtube.com/watch?v=zGwa-Y-vL4U(I made the video with missing show cursor setting, so if the page scrolls up i clicked on the image in the bottom right corner)
Here we go:Add this to header.html between the <head></head> tag:
<script type="text/javascript" src="./js/scrolltopcontrol.js"></script>Place the following attached files into your /root/js/ folder:
- scrolltopcontrol.js
- up.png
That's itTroubleshooting:If you are using a non standard template that is based on div's like me, it can happen that
you see the image for scrolling up the page but you cannot click it.
In this case add this to your style.css:
#topcontrol {
z-index: 999;
}(If you have higher values then 999 increase it to the highest value you are using.)
Tweaking:in scrolltopcontrol.js you can change:
//startline: Integer. Number of pixels from top of doc scrollbar is scrolled before showing control
//scrollto: Keyword (Integer, or "Scroll_to_Element_ID"). How far to scroll document up when control is clicked on (0=top).
setting: {startline:100, scrollto: 0, scrollduration:1000, fadeduration:[500, 100]},
controlHTML: '<img src="./js/up.png" style="width:48px; height:48px; z-index:1000" />', //HTML for control, which is auto wrapped in DIV w/ ID="topcontrol"
controlattrs: {offsetx:10, offsety:80}, //offset of control relative to right/ bottom of window corner
anchorkeyword: '#top', //Enter href value of HTML anchors on the page that should also act as "Scroll Up" linksa simple Link to scroll back to top can be set by:
<a href="#top">Back to Top</a>Greetz X23
