วีดีโอ

Andrea, will you be posting links to the codes? Thank you for taking the time and effort to share such helpful content. You have been very instrumental in my GSAP learning journey. Merry Christmas and Happy New Year to you and your family.

Hi Andrea, ich konnte nicht widerstehen und habe deinen Code für meine Zwecke angepasst, so dass der Inhalt der Tabs bei jeder Auflösung perfekt dargestellt wird. Das erreiche ich durch eine dynamische Berechnung des Viewports. In meinem Code habe ich die Mobile Darstellung bewusst rausgelassen, weil ich ein Restaurantmenü Seite für Seite, mit Überlänge in den Tabs darstelle, die in der mobilen Auflösung nicht gut lesbar gewesen wären. Ansonsten wäre es natürlich auch auf Mobile anwendbar. Durch die dynamische Berechnung erspare ich es mir für alle Auflösungen, ob Tablet-PC oder Ultra-Widescreen, Anpassungen vorzunehmen. Es ist automatisch responsive 😅und spart viel Finetuning.

Unreaaaal, thank you so much!

Thank you this was awesome, and the extra heads up about margins/paddings & Z index is great information!

Nice. I do miss the color codes for the fonts etc and the menu

can i get it on elementor free version?

Thank you so much!

Thank you, Andrea!! Is a perfect Christmas gift for us! From Brazil!

Gracias por este gran regalo, feliz navidad para usted y su familia

Grazie Andrea!! Buon Natale e Felice Anno Nuovo !!!!

Amazing design! 🎉

Fantastic implementation of the accordion! Your videos are always a source of inspiration. Inspired by your work, my team has created a custom UI-based website using Elementor. If you don’t mind, I’d love to share the link and get your feedback!(you can always say NO- No hard feelings! but pls say yesss😅)

TH-cam pls stop recommending, her tutorial doesn't work

Hi Andrea, you can solve the letter-spacing issue at minute 12:30 by defining it in custom css instead in text style: .elementor-icon-list-item { letter-spacing: 3px; } .elementor-icon-list-item:hover { letter-spacing: 8px; transition: all 0.5s ease; } That will work Best regards

Hello, how is the popup menu linked to the hamburger icon?

Doesn't work on mobile?

Nice video, thank you, for the watermark maybe it can be removed if we hide it with a black container on top of it with a higher z.index ?

What she did after type "Navo" here? 3:10 Nothing happens when I type

Thanks for the guide.If it comes to web optimization I assume its better to use the code instead of adding another widget to the site is that correct? How impactful for web speed wdesignkit widgets are?

How can i do this with out elementor ?

Great implementation!!!

As good as always 💙

Thank you 👍

hey! i wanted to know can this be used to make a custom design single product page ?

Really Great Tutorial!!

can we add this code to a website for page transitions (like when you click a particular nav button), the page slides up with the lenis smooth transition ? please advise

Underrated tutorials 🔥

i just found your channel like 2 days ago and omg how many good things i learned ty alot and keep it up

Cool video! I found that, at least for me, using px instead of % for the.product-card:hover height worked much better and smoother. Keep up all the great work!

Nice! Where do I find the code?

Great for you¡¡¡ lovely tutorial. Resolved my problem. Thanks

Awesome video! Keep it up 💪

hey andrea, great video again!! can I share you one of my team's work for you to review? Btw it's completely ok if you say no. No pressure!!

In the Elementor Kit Library, we only find poor designs.

amazing

🤩🤩🤩

Could you share the code you used to smooth the scroll? Thanks for the video... Amazing like always

How can you do this within word press? thanks !

Thanks for the nice video. How can we do it when we want to create a second child row?

Hi I did this and the whole container broke, what is the reason for this and how can I fix it? Thank you

6:38 "Lets see how this looks on tablet" The way you look at the camera says it all lol

Your website link please from here I can get the code please

perfectly explained! Nailed!

HTML CODE <div class="toggle-btn"> <button class="burger" onclick="this.classList.toggle('active');" ></button> </div>

Great video! Would it be possible to achieve this effect if the inner sections are not full height?

where is the code snippets plz 🙂

HI there! I would love to know if it's possible to apply this effect in a logo but instead of making the header in the same page, to do it in the header we create as a template in elementor, I've been trying but it seems it does not work this way. Thank youuu!

You can use global styling to remove the padding of the entire section, just like you make everything better. ❤

It's an amazing website video, but I don't believe it's a tutorial. I think this is a video of how she made that website.

Hi Andrea, Nick here from Elementor! In the 3.25 version, we implemented the new browser-native anchors and CSS smooth-scroll. This means by default the browser should scroll smoothly, unless you have one of the following blocking settings: 1. You have enabled Reduced Motion on your OS or Browser (or disabled animations on your OS or Browser). 2. You have a smooth-scroll script that conflicts with the native CSS smooth-scroll such as Lenis smooth-scroll. Why nº1: - The 'scroll-behavior: smooth;' CSS property is declared inside a 'prefers-reduced-motion: no-preference' @media feature, which respects the visitorr's preferences on motion effects, since a substantial portion of the population suffers from motion sickness. Why nº2: Scripts such as Lenis hijack the scroll behavior, and you need to use the scrollTo() method to handle anchors. The previous Elementor smooth-scroll was also implemented as a script, and it prevented the default behavior of the browser, instead creating its own scroll behavior, which in turn also affected accessibility (motion sickness + removing the anchor link from the URL), and caused some issues with scroll-snap. The script was implemented at a time when there wasn't any native browser support for smooth-scroll (7 years ago), and accessibility was still not easy to implement. In your video, I believe the instant jump to the target was caused by Lenis. If you change Lenis' methods you shouldn't have any issue. I recommend removing lenis and relying on the native CSS implementation as it is much more lighter and also respects the visitor's preferences. I hope this helps! 😉