unplugged_web Posted March 2, 2012 Share Posted March 2, 2012 I'm not sure if this is the best place to ask this, but I'm not sure which section it fits best under. I've been asked to build a site that smoothly scrolls content and I don't know where to start. I'm trying to build something like the top part of this site where you click on the arrows and it scrolls to another set of stories. I've tried to disect the code on the site, but when I try to implement it myself it doesn't work. I pressume it's some sort of jquery plugin but that's as far as I've got with it. I'd be grateful for any help on this as I've been trying to work it out for months and haven't got anywhere - except now have less hair!! Thanks. Link to comment Share on other sites More sharing options...
ShadowMage Posted March 2, 2012 Share Posted March 2, 2012 It may be a jQuery plugin, but a plugin isn't really necessary. All it requires is two divs and the animate() function. Obviously, you'll also have to have some buttons to trigger the scrolling (unless you want it automatic).You'll have one div which will have a fixed width/height, relatively positioned and overflow set to hidden. This will be your view pane. Inside the view pane div, you'll have another div which will hold the content you wish to scroll. This div will need to be absolutely positioned.Now you just need to bind click events to your buttons which will animate the left (or right) CSS property of the content div to move it around. EDIT: If you want to be fancy, and don't need to support older browsers, you could use CSS 3 transitions to do the same thing. This would be easier, since all you need to do is increment the left or right properties with regular JavaScript (no need for jQuery, though you could still use jQuery if you wish). The downfall, as mentioned, is that older browsers (most notably IE8 and down) do not support transitions, so there would be no animation (it would still scroll, just not smoothly). Link to comment Share on other sites More sharing options...
unplugged_web Posted March 2, 2012 Author Share Posted March 2, 2012 Thanks, that sounds like to solution, I've not worked with animate functions before so will have a look at that. To be honest I've not really worked with JavaScript much at all which is why I thought a plugin would be best, but I'd certainly prefer to do it myself. Thanks Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.