Skip to content

Instantly share code, notes, and snippets.

View perymimon's full-sized avatar

pery mimon perymimon

  • israel
View GitHub Profile
@andreiglingeanu
andreiglingeanu / nullify-transforms.js
Last active January 30, 2024 22:17
A nice way to nullify CSS transforms and get original positions of the un-modified rect
// Nullify the transforms of the element
//
// This is all behaving just like getBoundingClientRect() but it nullifies all the transforms
// and kinds _reverts_ the element onto its original position.
// This will work even with complex translations, rotations.
// The beauty is in the way it applies matrix inverse onto the transformation
// matrix and mutates the getboundingclientrect along the way.
//
// Usage:
// let { top, left } = nullifyTransforms(el);
@richard512
richard512 / svg-css-text-animation.htm
Created May 10, 2015 08:42
SVG Text Stroke Animation Via CSS. Demo: http://jsbin.com/fekigigeli
<svg width="500" height="150">
<text x="100" y="80" fill="none" stroke="black" stroke-width="1" font-size="50">Loading...</text>
</svg>
<style>
text {
font-family: sans-serif;
stroke-dasharray: 100%;
stroke-dashoffset: 100%;
@hemanth
hemanth / es6-dom-extend.js
Last active January 27, 2024 12:38
Extend DOM elements ES6
class SmartButton extends HTMLButtonElement {
constructor() {}
}
let sb = new SmartButton();
document.body.appendChild(sb);
/*
I get the below error:
TypeError: Failed to execute 'appendChild'
<link href="style.css" rel="stylesheet" />
<!-- I am collapsed by default -->
<nav id="main-navigation" class="navigation">
<a href="#">Nav Links</a>
<!-- more -->
</nav>
<!-- I am full width by default -->
<div class="page-wrap">