This is my first Web Extension ever, It took some time figuring out how to actually develop one, as its quite different than just making a web-page. This first extension is pretty basic, just so I can learn and see what is possible. Link to github repo: https://github.com/IpsumLorem16/Simple-IP-Camera-Viewer
Category Archives: Web development
Animated SVG Cyberpunk logo (with filters)
See the Pen Cyberpunk animated SVG logo {fork} by IpsumLorem16 (@ipsumlorem16) on CodePen. Try holding down the mouse-button, and clicking/hovering over the logo. In this post I will describe how I used SVG filters, CSS and GSAP to create my own version of the animated cyberpunk logo.
Making accessible custom Radio Inputs
Making (accessible) custom radio inputs.
SVG loading spinner
By animating the stroke properties of a SVG circle you can create a cool spinner loading icon.
An Introduction to SVG animation
For anyone who wants to try SVG animation, but has no idea where to start.
Animated SVG loading Icons
Three SVG dot loading Icons, animated with CSS. In a few different styles.
Creating a toggle switch – easy
Create a simple on-off toggle switch. With HTML, JS, and CSS, That is also Accessible.
Creating an animated dismiss all icon
Creating a reusable animated dismiss all icon with JavaScript.
Unusual behaviour in Firefox when using ‘preventDefault()’ on ‘mousedown’ event
Firefox completely blocks css :active pseudo-class when using PreventDefault() on mousedown event, unlike other browsers. This is undefined behaviour, and can lead to some hard to fix bugs, especially when you had no idea Firefox implemented this.