Image opaque when hovering

  • Resolved murielzs

    (@murielzs)


    5 years, 3 months ago

    Hello,

    Most pictures in my website get opaque white when I hover over them, as you can see in this post. The thumbnail at the top doesn’t get opaque but the other pictures do.

    [ redundant link removed ]

    Do I have to add CSS for each picture used or is there a quicker way to apply this rule to all pictures? I am not sure if I should use the CSS a;hover {} or img:hover {}?

    Any help is welcome,
    Thank you,

    • This topic was modified 5 years, 3 months ago by Jan Dembowski.

    The page I need help with: [log in to see the link]

Viewing 6 replies - 1 through 6 (of 6 total)
  • corrinarusso

    (@corrinarusso)

    5 years, 3 months ago

    See attached :

    View post on imgur.com

    Unfortunately, the theme author put this style functionality inline with the img element, so you will need to edit the template.

    You can follow this noscript option :

    View post on imgur.com

    Thread Starter murielzs

    (@murielzs)

    5 years, 3 months ago

    Ok, thank you for this Corina,

    sorry to ask, but what is a no script option?

    corrinarusso

    (@corrinarusso)

    5 years, 3 months ago

    There is an option in your template to replace the current output of the image that is shown here :
    <noscript><img data-attachment-id="19124" data-permalink="https://www.wiserockproperty.com/questions-to-ask-estate-agents/marketing-typewriter" data-orig-file="https://www.wiserockproperty.com/wp-content/uploads/Marketing-Typewriter-1.jpg" data-orig-size="850,567" data-comments-opened="0" data-image-meta="{&quot;aperture&quot;:&quot;0&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;0&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;0&quot;,&quot;iso&quot;:&quot;0&quot;,&quot;shutter_speed&quot;:&quot;0&quot;,&quot;title&quot;:&quot;&quot;,&quot;orientation&quot;:&quot;1&quot;}" data-image-title="Marketing Typewriter" data-image-description="" data-medium-file="https://www.wiserockproperty.com/wp-content/uploads/Marketing-Typewriter-1-300x200.jpg" data-large-file="https://www.wiserockproperty.com/wp-content/uploads/Marketing-Typewriter-1-800x534.jpg" class="alignleft wp-image-19124 size-medium lazyload" src="https://www.wiserockproperty.com/wp-content/uploads/Marketing-Typewriter-1-300x200.jpg" alt="" width="300" height="200" srcset="https://www.wiserockproperty.com/wp-content/uploads/Marketing-Typewriter-1-300x200.jpg 300w, https://www.wiserockproperty.com/wp-content/uploads/Marketing-Typewriter-1-150x100.jpg 150w, https://www.wiserockproperty.com/wp-content/uploads/Marketing-Typewriter-1-768x512.jpg 768w, https://www.wiserockproperty.com/wp-content/uploads/Marketing-Typewriter-1.jpg 850w" sizes="(max-width: 300px) 100vw, 300px" /></noscript>

    You could use this markup to change your templates within the theme.

    Since you have a paid theme, you should really be seeking support from the theme Author :
    https://themeforest.net/item/maya-smart-powerful-wp-theme/9660706/comments

    Thread Starter murielzs

    (@murielzs)

    5 years, 3 months ago

    Thank you Corrina,
    I will investigate further.
    Sadly the theme is not supported by anyone anymore 🙁
    My theme is Mayashop and not Maya…

    Thanks again for your help!

    • This reply was modified 5 years, 3 months ago by murielzs.
    corrinarusso

    (@corrinarusso)

    5 years, 3 months ago

    And just another reason ThemeForest sucks!!

    Sorry – couldn’t help myself. :-/

    Thread Starter murielzs

    (@murielzs)

    5 years, 3 months ago

    🙂

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

The topic ‘Image opaque when hovering’ is closed to new replies.