Blinking Images Results In Divs Shifting Around

JavaScript
1

Hi folks,

I’m trying to animate an image on my web page. The image sits above a paragraph div. When I implement the javascript function to make the image blink, the paragraph div moves up - within the part of the interval where the image blinks off. How can I avoid this? Thanks in advance for your help!

This is my Code Pen link here: https://codepen.io/IDCoder/pen/LrQRrw
This is my javascript code:

/*............................make robot hand blink................ */

/* this blinking function doesn't work good enough for my intentions....
var element = $("#up");
var shown = true;
setInterval(toggle, 700);

function toggle() {
    if(shown) {
        element.hide();
        shown = false;
    } else {
        element.show();
        shown = true;
    }
}

And here is the corresponding HTML code:

  <div class="col-md-3" id="additional1"> 
    <div class="robot" id="up"><img src='//cdck-file-uploads-global.s3.dualstack.us-west-2.amazonaws.com/freecodecamp/original/3X/b/f/bf1f556e6989fa75f95e95bb2bd1e16d41024ace.jpg' width="100" height="213"></div>
    <div class="paragraph"><p>Every single business belongs on the internet, every last one of them! The internet is a medium by which people in the farthest corners of the world can see you - who you are and what you are about.</p>  
    </div>
  </div>
```
2

$.hide() removes the DOM element entirely, and the paragraph moves up to fill the void. You can change the visibility of the element without removing it by modifying the opacity in CSS.

if (shown) {
  element.css('opacity', 0);
  shown = false;
} else {
  element.css('opacity', 1);
  shown = true;
}
3

@PortableStick, thanks so much for your help! At first I was going to go an over-complicated route and create a white placeholder div (of exact same size as picture, existing in the CSS sheet only…and then create some javascript hide thingy. But thanks for these instructions, I won’t need to!!! :grinning::heart_eyes:

Can you also checkout this question I posted here: Twitch TV: How Do I Get Information Appended to Display Screen To Not Show on Buttons Mouseout? …?? :thinking::thinking::persevere: