chrisle

Groovy text fade in script

Just a quickie for y'all.

A Pen by Jamie Coulter on CodePen.

License.

chrisle

Groovy text fade in script

Just a quickie for y'all.

A Pen by Jamie Coulter on CodePen.

License.

chrisle

<div class="text">
  <p>Nachos are</p>
  <p>
    <span class="word wisteria">tasty.</span>
    <span class="word belize">wonderful.</span>
    <span class="word pomegranate">fancy.</span>
    <span class="word green">beautiful.</span>
    <span class="word midnight">cheap.</span>
  </p>
</div>

chrisle

<section class="container">
  <h1>
    <span class="title">This is</span>
    <span class="title">a long</span>
    <span class="title">long title</span>
  </h1>
  
  <div class="button">restart</div>
</section>

chrisle

#textContainer

chrisle

Bouncy type animation

Bouncy type with TimelineLite

A Pen by Chris Le on CodePen.

License.

chrisle

Bouncy type animation

Bouncy type with TimelineLite

A Pen by Chris Le on CodePen.

License.

chrisle

/**
 * To answer @AnnieCushing's question on Twitter:
 * https://twitter.com/AnnieCushing/status/806518054368739329
 * 
 * Author: Chris Le - @iamchrisle
 *
 * There's a few ways to do this.
 * - Like @SimoAhava suggested, server redirects that strips parameters if you
 *   have the ability to control the server.

chrisle

/**
 * Install x-ray with: 'npm install x-ray'
 * (Also see: https://github.com/lapwinglabs/x-ray)
 * 
 * Run with: node scraper.js
 * 
 * Result:
 * 
 * [ { rankCurrent: '1',
 *     rankLast: 'Last Week: 1',

chrisle

<link rel="import" href="../chart-js/chart-js.html">

<polymer-element name="my-element">

  <template>
    <style>    
      :host {
        position: absolute;
        width: 100%;
        height: 100%;