Thursting Posted October 27, 2021 Share Posted October 27, 2021 Hello guys, I have added some code that allows the website to scroll through some logos for me and its working great - I was wondering if someone is able to help me adjust the sizing and width? Here's how it looks currently: https://gyazo.com/3f62022bd16f2bc46b57b493171de45a As you can see below was the old style with much smaller logo sizes - I was wondering how I can adapt the code below to scale the images down so they are slightly smaller on the page and don't take up so much height. I've tried adjust the height values but this just crops the images instead of scaling them down. Code: //IMAGE SLIDER// .slider { width: 105%; overflow: hidden; } .slider .slider-image { background-image: url(https://static1.squarespace.com/static/61373ecf653d655103320d70/t/6179388ffe54b13e769fab63/1635334288995/Logo+Strio.png); width: auto; height: 325px; background-size: 11700px 325px; animation: slide 100s linear infinite; } @keyframes slide { from {background-position-x: 0px;} to {background-position-x: -11700px} } Full width Adjustment - I also would like to ensure this image slider spans the full width of the page left and right. I adjust the width to 105% which has made it full width on the right side of the page but if you see the example below, you can see the left width is cropping the image: https://gyazo.com/7fae76d26deeb549d7b37a81f997bd8e Any advice would be appreciated 🙂 Link to comment
tuanphan Posted October 28, 2021 Share Posted October 28, 2021 Hi, What is site url? Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment