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
Post a Comment