ATTENTION, PLEASE READ: New topic creation is disabled, as we have moved to a new support system. Your existing topics will remain, but for all new requests you will need to use the new system. Click here to go to the new support request form.

• Back to forum

  Posted in: Cardinal
• February 8, 2016 at 8:01 am #247018
  hesani84

  Member

  Post count: 15

  So when you add a hyperlink to an image, the overlay hover + zoom effect is automatically activated.

  I would like to keep my image hyperlink without the overlay hover + zoom effect.

  I used the code below to deactivate the overlay hover, but it deactivates the hover for the entire page, is it possible to have an image specific overlay deactivation code?

  figure.animated-overlay:hover > img {
  transform: none;
  }

  February 8, 2016 at 9:04 am #247028
  Kyle – SUPPORT

  Moderator

  Post count: 35880

  Hi

  You only want to do it to one image? You will need to add an extra class to the image asset

  – Kyle

  February 9, 2016 at 8:27 am #247436
  hesani84

  Member

  Post count: 15

  Thanks Kyle,

  I’ve been trying to all day to figure out exactly how to format the extra class within the code.

  Is this correct? extra class is (mt0 and mb0)
  .mt0 and mb0 figure.animated-overlay:hover > img {
  transform: none;
  }

  February 9, 2016 at 9:08 am #247443
  Kyle – SUPPORT

  Moderator

  Post count: 35880

  No, use a class like ‘imgnohover’

  Then use:

  .imgnohover figure.animated-overlay:hover > img {
  transform: none;
  }

  – Kyle

  February 12, 2016 at 7:29 am #248534
  hesani84

  Member

  Post count: 15

  Ok, thanks Kyle.

  Just to make sure I did everything correct,

  I went to the image edit page and changed extra class to imgnohover

  Then I inputed the code into the custom css. I had the following error code (Element ( figure.animated-overlay ) is overqualified please use animated-overlay with out element name

  I removed the “imgnohover”, then tried removing the “imgnohover figure”, and it still didn’t work.

  Is there something I’m doing wrong? Thanks for the help.

  February 12, 2016 at 9:01 am #248538
  Kyle – SUPPORT

  Moderator

  Post count: 35880

  Please add it all back so I can check, when it says it’s overqualified ignore it, its just the editor thinking you don’t need all of it but you do to overwrite the style.css file

  – Kyle

  February 12, 2016 at 8:18 pm #248841
  hesani84

  Member

  Post count: 15

  Ok, it’s done,

  I attached screenshots in case you notice some error that I’ve made.

  Thanks!

  Attachments:

  You must be logged in to view attached files.
  February 13, 2016 at 12:05 pm #248897
  Kyle – SUPPORT

  Moderator

  Post count: 35880

  Add this:

  .imgnohover figcaption {
    display: none;
  }
  .imgnohover figure.animated-overlay:hover > img {
    transform: none;
  }

  – Kyle

  February 15, 2016 at 2:10 am #248988
  hesani84

  Member

  Post count: 15

  Ok, it worked!

  Thanks once again!

  February 15, 2016 at 8:41 am #249002
  Mohammad – SUPPORT

  Moderator

  Post count: 27441

  Hi,
  Great thanks to Kyle.
  Mohammad

• Back to forum

  Posted in: Cardinal