Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #638689

    Hi there,

    On the page in the link below I have used pictures as buttons and I would like to jump to another part of the page using a link with, for example, #video like in the left picture.

    – I would like to ONLY have a hover effect that changes the size like the one on the right, but this only works on pics that have NO link behind it. The left and middle picture have links like #video to scroll to another part of the page, but then the default hover effect is used (white square and green circle) on top of the change in size.

    – Can the buttons go SMALLER instead of bigger on hover, otherwise the picture gets cut off at the edges in this 1/3 column width.
    BTW: When I use 1/2 columns that doesn’t happens, why is that?

    Thanks!

    #639130

    Hey vossenm!

    Thank you for using Enfold.

    1/) Do you want to remove the hover effect? Please add this in the Quick CSS field:

    span.image-overlay.overlay-type-extern {
        display: none !important;
    }

    Turn on the custom css class field if you want to apply this on specific elements: http://kriesi.at/documentation/enfold/turn-on-custom-css-field-for-all-alb-elements/

    2.) Use this to decrease the size of the image on hover:

    .av-hover-grow:hover img {
        -webkit-transform: scale(.8);
        transform: scale(.8);
    }

    Regards,
    Ismael

    #639790

    Thank you very much, that worked great!

    Marcel

    #639841

    Hey!

    Glad we got it short out!
    Please let us know if we can help you with anything else, just open a new ticket for us.

    Regards,
    Basilis

Viewing 4 posts - 1 through 4 (of 4 total)
  • The topic ‘Hover effect on picture changes when I put a link behind it’ is closed to new replies.