css - Javascript: Toggle images in the same position -


on website having troubles toggled images.

as can see have table of content on left , mouse on over single rows image toggled on right.

it happens images not in same position each image moving "down".

how can keep of them on top?

this css code , js script i'm using:

css (to hide images)

.haus-a-one,.haus-a-two,.haus-a-three,.haus-a-four,.haus-a-five,.haus-a-six,.haus-a-seven,.haus-a-eight { display: none; } 

js

<script>     jquery(document).ready(function($){  $(document.body).on("mouseenter mouseleave", ".tablepress-id-1 .row-2.even", function() { $('.haus-a-one').toggle(); });   $(document.body).on("mouseenter mouseleave", ".tablepress-id-1 .row-3.odd", function() { $('.haus-a-two').toggle(); });  $(document.body).on("mouseenter mouseleave", ".tablepress-id-1 .row-4.even", function() { $('.haus-a-three').toggle(); });    $(document.body).on("mouseenter mouseleave", ".tablepress-id-1 .row-5.odd", function() { $('.haus-a-four').toggle(); });  $(document.body).on("mouseenter mouseleave", ".tablepress-id-1 .row-6.even", function() { $('.haus-a-five').toggle(); });  $(document.body).on("mouseenter mouseleave", ".tablepress-id-1 .row-7.odd", function() { $('.haus-a-six').toggle(); });  $(document.body).on("mouseenter mouseleave", ".tablepress-id-1 .row-8.even", function() { $('.haus-a-seven').toggle(); });  $(document.body).on("mouseenter mouseleave", ".tablepress-id-1 .row-9.odd", function() { $('.haus-a-eight').toggle(); });     }); </script> 

removing

#pg-220-0, #pg-220-1, #pl-220 .so-panel { margin-bottom: 30px; }

solves problem have check components can effect.


Comments

Popular posts from this blog

python Tkinter Capturing keyboard events save as one single string -

android - InAppBilling registering BroadcastReceiver in AndroidManifest -

javascript - Z-index in d3.js -