[Solved] How do I make an image repeatedly show and hide every x seconds?

by


Taking your question quite literal, I think this is what you want. Image shows for 10s hides for 10s, then shows for 10s and hides for 7s, repeat.

function promoFade() {
 $('#promo').delay(x).fadeOut(150).delay(x).fadeIn(150).delay(x).fadeOut(150).delay(x).fadeIn(150);
};
setInterval("promoFade()", 0);

Added setInterval in case you need to wait for the page to load. There are better ways and personally, I would lose the 7s and loop with CSS keyframes as mentioned in other answers, yet if I was chucking something together that was very simple, needing that 7s, this is what I would start with. 

function promoFade() {
  $('#promo').delay(10000).fadeOut(150).delay(10000).fadeIn(150).delay(10000).fadeOut(150).delay(7000).fadeIn(150);
};
setInterval("promoFade()", 0);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
 <div id="promo" class="gif" style="margin-top:33px;">
     <img width="320" height="267" src="http://placehold.it/320x267/green/ffffff/&text=image">
</div>

0

solved How do I make an image repeatedly show and hide every x seconds?