October 9, 201015 yr Hi all, I was wondering how would I achieve this: On a webpage, the page starts at the bottom and you can scroll up? So rather than scrolling down, you would need to scroll up to see the content? Thanks
October 9, 201015 yr Author I want to be able to make the whole page scroll upwards by scrolling by mouse etc not auto scroll. So for example on this topic on the forum, i want my page to start at the bottom of the page and then the user would scroll up in order to see new content. Thanks
October 9, 201015 yr Hmm. You could always have a div at the bottom of the page with the id "something" and then link to the page with using /whateverpage#something Alternatively the only other feasible way I can think of is Javascript. Something like window.scrollTo(0, document.body.scrollHeight);
October 9, 201015 yr is this the index page or is it a page that you are linking to? As you could use an anchor something along the lines of: <div id="bottom"></div> The link would be to: http://yoursite.com/#bottom Then the page would start at the bottom and the user could scroll up. You could probably do it on the index page too, you could maybe use a redirect in your .htaccess an tell it to go to yoursite.com/#bottom instead of just yoursite.com, that way when someone goes to your site it will automatically take them to the bottom of that page, or there might be a JS way around it.
October 9, 201015 yr Author It will be the index page, so when a user comes to the website, i would like it to start from the bottom? then they can scroll up? How would the javascript be implimented? im little new to this
October 10, 201015 yr Author Really easily, all you need is jquery, no plugins required. Set up a normal html document with a your anchors in place. In the doc ready handler add the following javascript. $('a[href*=#]').each(function() { if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname && this.hash.replace(/#/,'') ) { var $targetId = $(this.hash), $targetAnchor = $('[name=' + this.hash.slice(1) +']'); var $target = $targetId.length ? $targetId : $targetAnchor.length ? $targetAnchor : false; if ($target) { var targetOffset = $target.offset().top; $(this).click(function() { $('html, body').animate({scrollTop: targetOffset}, 600); return false; }); } } }); Added the <script></script> in these tags and set up an anchor. do i need to link to jquery? like so: <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script> made a link to the anchor at the bottom of the page and it goes up to it? but what is the javascript doing ? also the page loads at the top of the page rather than at the bottom? i need it to load at the bottom.
October 10, 201015 yr Author Found out that i can put this in the page: <body onload="scrollTo(0,5000)"> Is this any good?
October 10, 201015 yr If it works, its fine, but from a users standpoint it messes with their mindset. You would expect to scroll down. A lot of technically minded people may think it is creative but a lot of people would be baffled and possibly "scared".
October 10, 201015 yr Author Upon experimenting with this oppisite scroll i have decided not to use it for that very reason people natrally read downwards not up. so I have learnt a little more in regards to UX
October 13, 201015 yr I want to be talented to make the whole page scroll upwards by scrolling by mouse etc not auto scroll. So for example on this topic on the forum, i want my page to start at the bottom of the page and then the user would scroll up.
October 16, 201015 yr Actually well, all you ask is query, no plugins required. Set up a normal html document with a your anchors in place. In the document ready manager add the following javascript.
Create an account or sign in to comment