jquery - Scroll a div based on a draggable element (reversed) -
i found code scrolling div via draggable element. don't quite understand posted answer , want in reverse.
original here : scroll div based on draggable element
i modified fiddle , made scroll down on load, original answer works without scrolling content down.
i added block scroll down
//modification var timeline = $('#timeline'); var tlparent = timeline.parent(); var tlheight = parseint(timeline.css("height")); var tlpheight = parseint(tlparent.css("height")); //scroll down content on load var newpos = 0 - (tlheight - tlpheight); timeline.animate({"top":newpos + "px"},800,"linear"); //end modification
my modification : http://jsfiddle.net/j3toxicat3d/hxbgd/
help anyone? thanks
hey battled script , got working in reverse -
//modification var timeline = $('#timeline'); var tlparent = timeline.parent(); var tlheight = timeline.height(); var tlpheight = tlparent.height(); //scroll down content on load var lastdirection , newpos = tlheight - tlpheight; $('#timeline_wrapper').animate({scrolltop:newpos + "px"},800,"linear"); //end modification var $controller = $('#controller') , scrollableheight = $('#timeline').height() - $('#timeline_wrapper').height() , draggablewidth = $('#horizontal_control').width() - $controller.width() , ratio = scrollableheight / draggablewidth , initialoffset = $controller.offset().left; $controller.draggable({ revert: false, containment: "parent", axis: "x", drag: function (event, ui) { var distance = ui.offset.left - initialoffset , currentpos = $('#timeline_wrapper').scrolltop(); var direction = ui.position.left; (lastdirection < direction) ? $('#timeline_wrapper').scrolltop(currentpos - distance) : $('#timeline_wrapper').scrolltop(currentpos + distance); lastdirection = ui.position.left; } });
i think you'll notice modified.
Comments
Post a Comment