Actually, I am currently working on making a pure CSS text slideshow as a topbar in my site's header. The code I have created is: HTML <div class="slider"> <p class="slide">30% to 60% off Sitewide | Extra 30% off Sale</p> <p…
I made a responsive CSS-only hamburger menu, designed to be "compatible" with PicoCSS. This means that the usual nav menu is simply a row-based flexbox, per PicoCSS documentation. My menu works, as the codepen link demonstrates, but it isn't animated.…
I want to create some decoration for my website and this is the svg I have: svg image <svg width="156" height="142" viewBox="0 0 156 142" fill="none" xmlns="http://www.w3.org/2000/svg"> <g> <path d="M144.094 67.4748C144.094 75.9193 142.43 84.2811 139.197 92.0827C135.965 99.8842 131.226 106.973 125.253…
I have a paragraph with around 20 lines. I want each of those lines to repeat itself after 1 scroll is completed. For example: Let's say I had a line in a paragraph that is as follows: 1,2,3,4, I would…
I am trying to make a logo for header, however I want the last letter to be inclined. like this: and when hovering to be straightened and fall back to it's default position. I tried this: .nav-branding { text-decoration: none;…
Iam trying to rotate an element once, but scale the element back and forth in an infinite loop. However, when I chain the two animations, only the last one runs. How do I make two different animations to work together?…
I want to delay this fadein animation 5s .fade-in-image-2 { animation: fadeIn 5s 10s; } is it possible?
While creating a sticky navbar that should be animated on scroll reducing its height I notice a strange bug. When scroll small (for example only one tap on down arrow key), the nav is bouncing because the script seems to…
There are two questions, and I can't think of the solution. Example: https://jsfiddle.net/uL3fktrh/ Question 1. After enabling display:none of #a in css, animate will fail. Question 2. I want to restart animate every time I move into .bt, so I…
I'm animating a background gradient by moving the background-position via animation. However, the transition from the end of the animation to the start of the next cycle isn't smooth. It should appear as if it's on a continuous loop. What…