JQuery :: Prevent Script From Starting New Animation While Old One Still Lasts?
Sep 1, 2010
How can I make the script below "stop responding" when it's already animating?I want the script below to animate ONCE and STOP animating (even if mouse is still on element #s2) until I take mouse off it and hover again. This is what I'm using:
I have some links on my page with ajax calls, and the callback animates the links. My problem is, if I quickly click on two of them, the first one will begin to animate (ajax will complete successfully), and then when I click on the second one, the first one will stop animating, and only the second one will finish.
// document.ready /* behavior for add to cart button */ $('a.item-addCart').live('click', function() { addToCart($(this)); } ); function addToCart(button){ /* parse data from button clicked, corresponding quantity box, and hidden price field */ $item_id = button.attr('id').split('-')[2]; $item_qty = $('input#item-addCartQuantity-'+$item_id).val(); $item_price = $('input#item-addCartPrice-'+$item_id).val(); /* set loading notification */ $('div#item-addCartActions-'+$item_id).html('<img src="/images/ajax-loader.gif" />'); /* AJAX */ $('div#item-addCartActions-'+$item_id).load( 'shopping_cart/add', {item_id: $item_id, item_qty: $item_qty, item_price: $item_price}, function(responseText){ /* show response text */ $('div#item-addCartActions-'+$item_id).html(responseText); /* pause on response text for 2 seconds */ $('div#item-addCartActions-'+$item_id).animate({opacity: 1.0}, 2000, function(){ /* fade out response text */ $('div#item-addCartActions-'+$item_id).animate({opacity: 0}, 'slow', function(){ /* show link to shopping cart */ $('div#item-addCartActions-'+$item_id).html('<a href="shopping_cart">Item in cart</a>').css('opacity', 1); })});});}
Is there any way to tell the cycle-plugin to wait with the next slide when the previous one is still animating?When i use the default animation with a next and prev button and I click quickly on the next button the slides start flicker.
I've searched the whole internet, but couldn't find anything regarding this.
Problem occures when image is clicked another time(you have to click quick to see the problem) before end of animation. I think that preventing it from being clicked would solve the problem but im not sure.
Code: $(function() { $('#gallery img').click(function() { var zIn=$(this).css('zIndex');[code].....
I am working on some JavaScript, that amongst other things does searches in an index. The search can take a couple of seconds, and I would like to disable the form button that the user clicked to trigger the search. In addition I would like an animated GIF to appear, visualizing that a search process is ongoing.
My problem is: While the procedure that implements the search is executed, the browser window is not refreshed. The button stays in "down" mode, the gif freezes.
Is there some command I could insert in between my code statements that lets the browser refresh it's window's contents?
I have a button which is animated with a rollover effect, obtained through jQuery of course. I wish to open a lightbox clicking that button and I tried with a simple, self-made lightbox and with FancyBox but in either case the lightbox is displayed without animation.I post the code for my buttons and the lightboxHTML for buttons:
$('#nav li a').click(function(e) { e.preventDefault(); $('#nav li a').removeClass('on');
[code]....
I need to do this, in addition to .click-binding, automatically; i.e., if no user-action by 15 secs I need this content-switching to start happening automatically; and also give 5 secs or so for the next div to show up (and hide div currently visible); how do I do this? like a slideshow, in other words, but switching divs (and doing the classes for the thumbnails)
Have cycle plugin implemented and it is functioning correctly except for the page quickly flashes the third slide before the rotation starts up.
I was able to assign opacity: 0 in the CSS for webkit and Firefox browsers that hides all three <LI>'s before it starts and that works. However, IE (even with filter: alpha(opacity=0);) won't take.
I tried using the cssBefore option but it throws an error when I try to put thefilter: alpha(opacity=0), into it.
Heres' the current code:
jQuery('.video-gallery').each(function() { var holder = jQuery(this), list = jQuery('.video-holder > ul', this), switcher = jQuery('.items > ul', this),
How can I find all elements that have a attribute starting with some character?
Everywhere I found example like: $("[href$='.jpg']") which checks for all tags having an attribute "href" with value ending with "jpg" But how can I instead find all tags having a attribute having name ending with 'f'
something like $(img[$f]) ... trying to find all img with attribute ending with g
How to loop alternate elements in JQuery ? I see it has each function which loops each elements . But I want every alternate elments to loop starting from an index.is it possible in JQuery ?
I'm using the uploadify jQuery plugin from here: [url] & am having some problems.
Everything is working correctly but the uploadifyUpload() function doesn't appear to be triggering. It is not accessing the add_list.php script whatsoever.
Here is my code from my header..
Code:
It correctly shows an alert box with "Correct" so I know it's getting in there to run it, but it just isn't running.
Shouldn't need to see this, but here is the errorCheck() function if interested..
Code:
Lastly this is the HTML code that calls it.. stripped out a lot of uneeded code for clarity.
I've been messing with this code to make a fade in animation with setTimout. The only thing is addition isn't working on the fade in. A subtraction on a negative works though. This seems strange to me.
changeit.style.opacity -= -0.01; works but when it's changed to changeit.style.opacity += 0.01; there's no fade in. It's the only thing I change. My intuition says to me it should work with addition, but maybe there's something I'm not understanding.
<html>
changeit.style.opacity -= -0.01; if this is set to changeit.style.opacity += 0.01; it doesn't work. What?
Of course this is all just for Firefox for now. If I put this in something useful I'll change it so it'll work in other browsers later.
I have a gif animation that I want to stop when the user mouses over the gif, and restart when the user mouses out. Is there a way to stop and start gif animation with JS? Or will I have to use Flash instead?
I have a frame called 'HEADER'. From this frame I would like to innitiate a Javascript Function in a frame called 'CONTENT'. ( function SearchWindow() {....} )
Is this possible and what should the script look like?
parent.content... is as far as I got. But I can't find the right function/variable for calling a function.
The root of the problem is a searchwindow is opened from Header. And in the searchwindow people can click on links... afterwhich the content-frame should change (with an PageID). But I can only get the HEADER frame to respond.
i'll go straight to the point, i have 8 rows and 3 columns, i want to populate each <td> starting from:
row 0 column 0 a value of 1 row 0 column 1 a value of 2 row 0 column 2 a value of 3 row 1 column 0 a value of 4 row 1 column 1 a value of 5 ... row 7 column 2 a value of 24
I have gone through many scripts and functions to find breadcrumbs. While some work, they do not give me the exact function as I need. Due to the layout of my hosting service, I am allowed many websites - however they are all within the same filestore space. At the moment I have 3 small websites that I use for testing and when experimenting with breadcrumbs it includes those websites with the new one I'm experimenting with, meaning Home isnt the homepage of that specific website, but rather the home of my entire file system. For example;
Has anyone come across any scripts or functions that allow me to do this - I have hunted around but the majority of the examples I have found produce the problem stated above.
The code I currently have implemented is the code found: [URL]
I have read the code and comments and set the 'domain name' variable to [URL] hoping that it would start at that page, but it does not.
I know you can use the onload statement to start a javascript when the page has loaded, but is there a statement that can start a javascript as soon as the page starts to load?
I'm creating a tool which will who a random image every time I press a button, when the image is clicked it will open a new tab which will show a website. I can tell you I've succeeded in all this, but I was wondering if there is any way in which I can let my "generator" show 1 standard image at first, and if this is even possible never show that image after it has been showed. The image will explain that the you have to press the button to go to the next image.The Code: