Home Forums Space themes support forum add to cart on over animation and hover content deactivate

add to cart on over animation and hover content deactivate

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #576190

    Jean-Michel
    Participant

    Hi,
    I would like to deactivate the animation so that everything stays still when you move the mouse over it and there is no “add to cart” “compare” “quick view” at the bottom. The view should remain as it loads without hovering.

    https://nimb.ws/E3U6ye2

    can you give me a code?

    Kind regards: Jean

    #576976

    Luke Nielsen
    Keymaster

    Hello,

    Try to use this custom to disable the hover effect:

    .xts-product .xts-product-thumb:hover .xts-product-hover-image {
        opacity: 0;
    }
    
    .xts-prod-design-summary-alt .xts-product:hover {
        transform: none;
    }

    Kind Regards

    #577000

    Jean-Michel
    Participant

    This CSS code doesn’t work.

    #577005

    Luke Nielsen
    Keymaster

    Hello,

    This one should work:

    .xts-product .xts-product-thumb:hover .xts-product-hover-image {
        opacity: 0;
    }
    
    .xts-prod-design-add-to-cart .xts-product:hover  {
        transform: none;
        box-shadow: none;
    }
    
    .xts-prod-design-add-to-cart .xts-product .xts-product-content-footer-inner {
        visibility: visible;
        opacity: 1;
        transform: none;
    }
    
    .xts-prod-design-add-to-cart .xts-product .xts-product-content {
        transform: translateY(-25px);
    }

    https://gyazo.com/7da86d26f469e771acccebf927018e3b

    Kind Regards

    #577276

    Jean-Michel
    Participant

    Not quite right. This is the hover view. Below you can see “add to cart” and “compare”. The image is also partially cut off because of the hover frame.
    https://nimb.ws/UD8dhvW

    The view should remain as here: https://nimb.ws/dzxHKsL
    Kind Regards

    #577440

    Luke Nielsen
    Keymaster

    Hello,

    The buttons are hidden so it’s impossible to show them and do not partially cut off the image. In this case, we can make the buttons to be displayed on hover otherwise I suggest you change the product design to another one.

    Let me know if you have any questions.

    Kind Regards

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