SOLVED: Brizy Pro Cloud - Auto Image Scrolling

Pb Pb

• December 30, 2020 18:00
• Edited

Hi Team,

Would you be able to assist with how to achieve the same auto scrolling effect, which you have in the default Layout section (example https://ibb.co/Sdrz8fC)?

 

Thank you in advance,

PB

0

• 

  Sandra Prunici

  • November 30, 2020 12:23

  Hi,

  At the moment, that effect isn't available in the Image element. In the builder for the Layout section was created some special classes with a special CSS code that have work in that way. If you want to recreate it you can ask for help from a CSS expert. We will like to help you with this but unfortunately, here on support, we can't provide such a complex and complicated CSS code and structure.
  Let us know if we can help you with something else.

  Best regards,
  Sandra

  0
• 

  Pb Pb

  • November 30, 2020 17:34

  Thank you Sandra. Is there a different way of contacting the CSS experts except this forum? 

   

  Regards,

  Peter

  0
• 

  Sandra Prunici

  • December 01, 2020 11:13

  I'm not sure if there are CSS experts (if you ask about our CSS developers, they don't enter in this forum :), there are available only Brizy Support Team) but you ask in the Facebook Brizy Community or in other freelancer groups for a CSS developer.

  Best regards,
  Sandra

  0
• 

  Pb Pb

  • December 01, 2020 18:54

  Much obliged Sandra. 

  0
• 

  Sandra Prunici

  • December 02, 2020 12:10

  Let us know if we can help you with something else.

  Best regards,
  Sandra

  0
• 

  Pb Pb

  • December 30, 2020 17:59

  Solution:

   

  1. Create a column,

  2. Paste this code in brizy css section and change the link and other variables accordingly

   

   

  element {

  position: absolute !important;

  top: 50%;

  left: 50%;

  transform: translate(-50%, -50%);

  width: 900px !important;

  height: 800px !important;

  background: url(put here URL of your image);

  background-size: cover !important;

  background-position: top !important;

  border: 5px solid #000 !important;

  box-shadow: 0 20px 30 px rgba(0,0,0,.5);

  transition: 5s linear !important;

  }

  element:hover {

  background-position: bottom !important;

  }

  0
• 

  Sandra Prunici

  • January 04, 2021 12:51

  Hi,

  Thank you for sharing us with this Custom CSS code! Hope it will help other users too.

  Thanks!

  Best regards,
  Sandra

  0

Please sign in to leave a comment.