jquery-animate

问题 I want to move a div down a page, and I want it to slow down as it reaches the target. I tried using call back with recursive func but it doesn’t look smooth: function MovePanel() { sidePanel.animate({ "marginTop": newCurrTop }, moveSpeed, function () { MovePanel(); }); } Is it possible to slow down an JQuery animation? If not what are the alternatives? Thanks. 回答1: The animate method takes a 3rd param called "easing"; learn about it here: http://api.jquery.com/animate/ 回答2: You might want to

问题 My Jquery code doesn't seem to work in IE8 when adding a doctype above my html tag. Maybe there's a way to restructure these codes to have it working in ie8. $(document).ready(function(){ //Caption Sliding (Partially Hidden to Visible) $('.boxgrid.caption').hover(function(){ $(".cover", this).stop().animate({top:'0px'},{queue:false,duration:160}); }, function() { $(".cover", this).stop().animate({top:'161px'},{queue:false,duration:160}); }); }); The website can be seen here: http://www

问题 I have a crazy problem in my portfolio: http://hericdk.com I made a simple animation with jquery, an animation with a space ship flying, and then it appears my work, this idea is nice, everyone liked, but the problem is that for some strange reason, when I click to see my projects and the ship starts to fly, if I change the browser tab and then return, all the background animation works normally.. but the animation remains of the ship is still waiting for the next action of the animation

问题 I am playing with Parallax scrolling like on that nike site. So I have been using scrollTop to determine the user's vertical position on the page and then I've been adjusting element's positions based on the changes to that value. Here I round the scrollTop value and log it. I'll show the log later. var distance = 60*(Math.round($(window).scrollTop()/60)); console.log(distance); Then, on click, I call this function which scrolls to the scrollTop value that I've passed it. function goTo(n){

问题 I'm having a problem with the setTimeout(). I want, in the mouseout state, that the submenu slides Up after a interval (500 miliseconds). But the setTimeout() isn't working. Like in this link: http://jsfiddle.net/felipepalazzo/Xyhvn/2/ The code: (function($){ $.fn.showMenu = function(options){ var settings = $.extend({ height : '40px', speed : '500', heightx : '20px' }, options || {}); return this.each(function(){ var elem = $(this); var menu_timer; elem.hover(function(){ $(this).stop()

问题 I have a back button in my header that looks like: <a href="index.html" data-role="button" data-direction="reverse" data-icon="arrow-l" data-iconpos="left">Back</a> The transition to get to this page is slide and, according to the documentation, adding data-direction="reverse" to my back button should 'reverse' the transition that got me to that page, ie: the previous page should slide back. However, this seems to be stuck just on the default fade transition. Is there something I have done

问题 I try to animate an image with zooming every one second, it work when I load my page but I want it every one second. I think when I use the same id of my image it's a problem. This is my JSFIDDLE. Thank you. 回答1: You're using setTimeout which will execute some code after a certain time, what you want is setInterval , which will execute some code every so often. http://jsfiddle.net/UxTdU/3/ 回答2: You could just increment the zoom property from within an interval. setInterval(function(){ $("

问题 I have the following jquery that scrolls the page to the top, then performs a callback function. The problem is that even if the page is already at the top, it still waits for the '1000' to elapse before performing the callback, which i dont want it to. $('html').animate({scrollTop:0}, 1000, 'swing', function(){ //do something }); 回答1: It doesn't wait It animates your document from top to the top... Funny but that's how it is. You have other alternatives. Either: check your page position

问题 I'm attempting to animate background position of some divs followed by a callback animation that does the same. What am I missing here? HTML: <div> <div class='divimg'></div> <div class='divimg'></div> <div class='divimg'></div> </div> ​ CSS: .divimg { width:250px; height:250px; margin:20px; float:left; background-size: 500px 500px; background-position: top center; background-repeat: no repeat; background-image: url(http://lorempixel.com/186/116/nature/1); }​ JavaScript: $(function() {

问题 I have a <div> that when hovered over, will show some text. When the mouse leaves, the text fades out. However, if the mouse enters the <div> again before the fadeOut is complete, the text never shows again. I am aware of hoverintent , but I'd prefer not to use it because of the slight perceived delay it gives to the mouseEnter/mouseLeave events. Is there no way that, upon mouseEnter , it simply clears the fadeOut and shows the text again? My current attempt using timeouts: var timeouts = {};