Fade in jquery div show
26,190
Solution 1
its because its already showing
<div id='updated' style="display:none">
fixes it
Solution 2
$('#updated').hide().fadeIn(800).delay(3000).fadeOut(800);
You could also set it in the css:
#updated{
display: none;
}
The problem is - it's already visible (by default).
Solution 3
You have to hide div
before fadeIn()
, you can use hide()
method to hide the div
.
<?php
if(isset($_GET['updated'])) { ?>
<div id='updated'><p>The product was successfully added to your Shopping Cart</p></div>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script type="text/javascript">
$('#updated').hide().fadeIn(800).delay(3000).fadeOut(800)
</script>
<?php } ?>
Author by
Pete Naylor
Updated on April 18, 2020Comments
-
Pete Naylor about 4 years
I am trying to get the below script to fade in and fade out with a delay in between. It shows the div correctly and fades out as it should, but it doesn't fade in?
<?php if(isset($_GET['updated'])) { ?> <div id='updated'><p>The product was successfully added to your Shopping Cart</p></div> <script src="http://code.jquery.com/jquery-latest.js"></script> <script type="text/javascript"> $('#updated').fadeIn(800).delay(3000).fadeOut(800) </script> <?php } ?>
Many thanks!