javascript - How can I animate/slide a div into view while moving the contents as opposed to just revealing the contents? -
i use jquery slideup , slidedown methods, instead of effect being 1 of contents merely being revealed, though screen being pulled , forth, contents slide view, though hidden panel being pulled , forth.
if want use jquery animate check fiddle: http://jsfiddle.net/cgly77us/1/
script:
$(document).ready(function(){ var slideupanimate = function(duration, callback){ var $element = $("#slideup"); var startposition = $(window).scrolltop() + $(window).height() + $element.height(); var finishposition = $element.position().top; $element.css("top", startposition + "px").show().animate({ top: finishposition + "px" },duration, callback); }; var slidedownanimate = function(duration, callback){ var $element = $("#slideup"); var finishposition = $(window).scrolltop() + $(window).height() + $element.height(); var startposition = $element.position().top; $element.css("top", startposition + "px").animate({ top: finishposition + "px" },duration, function(){ $element.hide(); callback(); }); }; slideupanimate(1000,function(){ //some callback code here like: slidedownanimate(1000); });
});
i think can adapt every situation.
Comments
Post a Comment