why second script does not work

[sweetysweety]

hi,i have a site like:http://www.terranartworks.com/testsite/tsv1/iletisim.html i tryin to make the blurred panel sliding to at the beginning and hide it,when i pressed at the button which stands upper form mail address.i did not understand why it is not working.do anyone help me to doing?

[justsomeguy]

It looks like the code for that button redirects to Google, if you're redirecting then why bother with an animation? There's an error in the same code on the clearInterval line, the interval you're trying to clear is undefined.

[sweetysweety]

you're right with animation but boss say that it will better:)they want to see,when user clicks a map button,the blurred panel will slide and google map will load synchronouslyi don't understand what you trying to say about clear interval.can you specify more?

[justsomeguy]

The code changed, the line that was using clearInterval isn't there any more.

[dsonesuk]

You are looking for a script similar to below, when clicked the link is disabled temporary as the animation is run, only when the animation is finished does to use the link value from href attribute, to go to that address

	   	 $('#maps').click(function(e){			e.preventDefault();			$(this).parent('.circle').animate({'width': 0, 'opacity': 0 }, 'slow', 'linear' ,function(){						window.location=$(this).find('a').attr('href');						});						});

Because you are using img tag instead of background image for anchor links you will have to use overflow hidden to prevent these images from still showing.

 .circle{ 			margin:0;			-webkit-box-shadow:0 0 5px #CCC, 0 0 400px #fff inset;			-moz-box-shadow:0 0 5px #CCC, 0 0 400px #fff inset;			box-shadow:0 0 5px #CCC, 0 0 400px #fff inset;			-ms-filter:"progid:DXImageTransform.Microsoft.Shadow(Strength=400,Direction=0,Color='#fff')";			filter:progid:DXImageTransform.Microsoft.Shadow(Strength=400,Direction=0,Color='#fff'); 			width:250px;			height:315px;			z-index:5000;					cursor:default;		overflow:hidden; /* added by dsonesuk */		}

Edited June 24, 2013 by dsonesuk

[sweetysweety]

The code changed, the line that was using clearInterval isn't there any more.

yes i change the code because of my panel couldn't show,when google map is in active state.so i removed that script.

[sweetysweety]

You are looking for a script similar to below, when clicked the link is disabled temporary as the animation is run, only when the animation is finished does to use the link value from href attribute, to go to that address

 $('#maps').click(function(e){ e.preventDefault(); $(this).parent('.circle').animate({'width': 0, 'opacity': 0 }, 'slow', 'linear' ,function(){ window.location=$(this).find('a').attr('href'); }); });

Because you are using img tag instead of background image for anchor links you will have to use overflow hidden to prevent these images from still showing.

 .circle{ margin:0; -webkit-box-shadow:0 0 5px #CCC, 0 0 400px #fff inset; -moz-box-shadow:0 0 5px #CCC, 0 0 400px #fff inset; box-shadow:0 0 5px #CCC, 0 0 400px #fff inset; -ms-filter:"progid:DXImageTransform.Microsoft.Shadow(Strength=400,Direction=0,Color='#fff')"; filter:progid:DXImageTransform.Microsoft.Shadow(Strength=400,Direction=0,Color='#fff'); width:250px; height:315px; z-index:5000; cursor:default; overflow:hidden; /* added by dsonesuk */ }

thanks a lot dsonesuk.it is a best answer for me:)