Remove Animation from Image Links

  • Hello All,

    Can anyone tell me how to remove the animation on images that include links? All of my images that have links move around on the page. Worse than that, the animation isn’t the same. Some move to the side, some move up and down creating large white space below. The same thing is happening with a live link with only text. It also moves around when hovered on.

    Thank you!

Viewing 3 replies - 1 through 3 (of 3 total)

  • Hi there,

    Thanks for writing in,

    Would you mind providing your website link. Meanwhile, if I’m not wrong so you are complaining about the hover effect on the images which shows an arrow sign with light green background, so you can disable that by adding following code under Appearance > Theme Options > Custom CSS:

    .entry-content .thumbnail-post:hover div.icon {
  display: none;
}

    Thanks.

    Thread Starter percept0

    (@percept0)

    Emranemranx,

    The website is https://www.perceptions.us.

    This is a different problem than you mentioned above.

    The problem exists on links established through the text editor. When words or images are linked to a website there is an animation/transition effect when you hover over the linked item. In this case specifically: on the Literary Consulting and Literary Editing pages I have a sidebar that offers Literary Resources. Each item is linked to a website offering information, goods, or services.

    The top item for the book moves the linked author name side to side and the image moves down approximately 30px (through an animation or transition effect) when you hover over them.

    The same happens for the second image which is linked to a video.

    The third image moves left to right when you hover over it for a service.

    I need all of theses animations to stop.

    Thanks! Your help is so appreciated. I would hate to scrap this theme because of this seemingly minor issue.

    I’ve been searching for the same CSS fix, and finally figured it out.

    Search your code for this line:

    #secondary a:hover, #secondary-2 a:hover

    You will see that padding is set to 5px — that’s what’s triggering the shift to the right when you hover over links/images in the #secondary (sidebar) area. Change 5px to 0px to stop your links from sliding around when hovered. This section of code should now look like this:

    #secondary a:hover, #secondary-2 a:hover {
    color:#7a9cad;
    text-decoration:none;
    padding-left:0px;
    }

    Hope this helps!

    Emily
    Cactus + Fog

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Remove Animation from Image Links’ is closed to new replies.