andreiglingeanu

// 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

<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

class SmartButton extends HTMLButtonElement {
  constructor() {}
}
let sb = new SmartButton();
document.body.appendChild(sb);

/*
I get the below error:

TypeError: Failed to execute 'appendChild' 

perymimon

<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">

mjackson

/**
 * Converts an RGB color value to HSL. Conversion formula
 * adapted from http://en.wikipedia.org/wiki/HSL_color_space.
 * Assumes r, g, and b are contained in the set [0, 255] and
 * returns h, s, and l in the set [0, 1].
 *
 * @param   Number  r       The red color value
 * @param   Number  g       The green color value
 * @param   Number  b       The blue color value
 * @return  Array           The HSL representation