Jump to content

george

Recommended Posts

I have a page with some jQuery on it.

In the header, I have

<script src="../js/jquery-1.9.1.min.js" type="text/javascript"></script><script>	$(document).ready(function(e) {		$("div.box").each(function ( i) {			var div = $(this);			setTimeout(function () {				div.fadeIn(800);			}, i * 800)		});	});</script>

And within the document body itself I have

	<script>		$("a.imp").click(function(){$(this).parents("div").css('z-index','2')});	</script>

Both functions do as I want, but the script that is within the document presents it's result real briefly, and then the automation generated in the header section runs again.

 

How can I make it stop? I want one thing to run on document load, and the other thing to run when the client clicks an anchor tag. But they both run when I click the anchor tag.

 

 

Link to comment
Share on other sites

I have tried chaining a .stop(), a stopPropagation(), and a stopImmediatePropagation() to the end of the in-document code as follows

$("a.imp").click(function(){$(this).parents("div").css('z-index','2')}).stopPropagation(); ;

None of them stopped the repeating of the animation, which I want to run only on document ready.

Link to comment
Share on other sites

I think you want to use .parent(), not .parents(). I can't say for sure as I don't know what your html is. as for stopPropagation(). the click handler should pass a single argument and you'll chain stopPropagation() on that. Jquery will pass the event object by default into the handler if said handler accepts a single argument. Refer to it's documentation for an example on it's use.

 

you also might want to look into queuing the animations. since the setTimeouts from the header can easily still be running when the user clicks something. run a search keyword for "queue" or look up some related functions like finish, and see how it meets your needs

Link to comment
Share on other sites

Wouldn't be more likely that since it is a anchor element, it doing what it is supposed to do and attempt to go to the link in href, so its running the onclick event code, then reloads the page, which causes it to run the onload script.

So you have to prevent the default action of the anchor.

$("a.imp").click(function(event){event.preventDefault();$(this).parents("div").css('z-index','2');});

I think you have to be more specific ('class') when using parents(), using 'div' depending on html code might be targeting the outermost or all div parent elements of clicked element.




			
		
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...