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 --- trk.elementor....
-- And you shouldn't discount Elementor Cloud Hosting either! trk.elementor....
-- 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): amzn.to/3feqH18
Soundproof Panels (to provide a dark setting, and prevent sound bounce): amzn.to/3HVfwqa
3m Ethernet Cat 7 Cable (to maximise the Internet Connection as the room is upstairs): amzn.to/3GlBvGw
Anker 6 in 1 Adaptor (for the Macbook Air to increase USB-C, USB-A, HDMI, Ethernet Ports): amzn.to/3tiukLA
USB-C to Lightning Port Cable (from my iPhone to my Macbook Air): amzn.to/3K2tGaU
Powerline Adaptor (boosts internet connection from downstairs 380mbs to the upstairs room 120mbs): amzn.to/3r8YcYc
Floodlights (positioned to glow onto the walls): amzn.to/33mRqWD
LED Light stands (either side of me): amzn.to/3Iaerez
Fifine Dynamic Microphone: amzn.to/3osbxu2
Floating Shelves: amzn.to/3Fhxyl1
Hanging Pendant Light Holders: amzn.to/3qgwnhg
Vintage Light Bulbs: amzn.to/3K0bQ8B
Music used:
Track: Will You Be Mine (Remix)
Free download: brokeinsummer....
Artists: brokeinsummer.com
Contact: brokeinsummer....
Music provided by Audio Library Plus
- Get Elementor Pro here --- trk.elementor....
-- 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: calendly.com/i...
-- LinkedIn: / imran-siddiq-7320a74a
-- Instagram: / batswebsitedesign
-- Twitter: / imranwebsites
-- Facebook: / websquadrontraining
PS: 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
Пікірлер: 30