Elementor - Shrink the Logo/Image on Scroll but not using Scrolling Effects

With some simple CSS you can shrink a Logo or Image (or even grow it) on scroll - especially when it's in a sticky header.

Add this to the Section's CSS:

@media screen and (min-width: 780px) {
.logoimage {
max-width: 100px;
width: 100px;
}

.elementor-sticky--effects .logoimage {
max-width: 40px;
width: 40px;
transition: 0.5s all ease-in-out;
}

}

.logoimage {
max-width: 80px;
width: 80px;
}

.elementor-sticky--effects .logoimage {
max-width: 40px;
width: 40px;
transition: 0.5s all ease-in-out;
}

selector{
background-color: #31312F;
}
Elementor - Shrink the Logo/Image on Scroll
-- Get Elementor Pro here ---- https://trk.elementor.com/25741
-- And you shouldn't discount Elementor Cloud Hosting either! https://trk.elementor.com/bapnesbbfa9i-cloudwebsitenew
-- Of course, we're affiliated to them, but it helps to pay for resources to keep creating ace content for you :)

Equipment Used:
Softbox Lighting Kit (to focus main light onto me in a dark room): https://amzn.to/3feqH18

Soundproof Panels (to provide a dark setting, and prevent sound bounce): https://amzn.to/3HVfwqa

3m Ethernet Cat 7 Cable (to maximise the Internet Connection as the room is upstairs): https://amzn.to/3GlBvGw

Anker 6 in 1 Adaptor (for the Macbook Air to increase USB-C, USB-A, HDMI, Ethernet Ports): https://amzn.to/3tiukLA

USB-C to Lightning Port Cable (from my iPhone to my Macbook Air): https://amzn.to/3K2tGaU

Powerline Adaptor (boosts internet connection from downstairs 380mbs to the upstairs room 120mbs): https://amzn.to/3r8YcYc

Floodlights (positioned to glow onto the walls): https://amzn.to/33mRqWD

LED Light stands (either side of me): https://amzn.to/3Iaerez

Fifine Dynamic Microphone: https://amzn.to/3osbxu2

Floating Shelves: https://amzn.to/3Fhxyl1

Hanging Pendant Light Holders: https://amzn.to/3qgwnhg

Vintage Light Bulbs: https://amzn.to/3K0bQ8B
Music used:
Track: Will You Be Mine (Remix)
Free download: https://brokeinsummer.com/will-you-be-mine-remix
Artists: https://brokeinsummer.com
Contact: https://brokeinsummer.com/help
Music provided by Audio Library Plus

-- Get Elementor Pro here ---- https://trk.elementor.com/25741
-- Of course, we're affiliated to them, but it helps to pay for resources to keep creating ace content for you :)

-- Book an Appointment/Consultation: https://calendly.com/info-28542
-- LinkedIn: https://www.linkedin.com/in/imran-siddiq-7320a74a/
-- Instagram: https://www.instagram.com/batswebsitedesign/
-- Twitter: https://twitter.com/imranwebsites
-- Facebook: https://www.facebook.com/websquadrontraining/

PS: https://websquadron.co.uk
PPS: Contact us at info@websquadron.co.uk
PPPS: We only build with Elementor Pro

Видео Elementor - Shrink the Logo/Image on Scroll but not using Scrolling Effects канала Imran Siddiq - Web Squadron