melanyss

Animated Star Rating

A star rating where stars pop out one by one if you choose a higher rating.

A Pen on CodePen.

License.

melanyss

<div id="wrapper">

    <div id="canvas_container"></div>

    <div class="text">
        <p class="quoteText">“ Never memorize something that you can look
            up.”<br><span style="font-style: italic; font-size: 1.4rem; color:#ED760D">#Stack Overflow</span></p>
    </div>
    <p class="clickInfo">click anywhere to start journey</p>

melanyss

Essential JavaScript Links

I no longer mantain this list. There are lots of other very comprehensive JavaScript link lists out there. Please see those, instead (Google "awesome JavaScript" for a start).

melanyss

<button class="cybr-btn">
  Cyber<span aria-hidden>_</span>
  <span aria-hidden class="cybr-btn__glitch">Cyber_</span>
  <span aria-hidden class="cybr-btn__tag">R25</span>
</button>
<button class="cybr-btn">
  Buttons<span aria-hidden>_</span>
  <span aria-hidden class="cybr-btn__glitch">Buttons_</span>
  <span aria-hidden class="cybr-btn__tag">R25</span>
</button>

melanyss

 {
  "name": "fcc-learn-npm-package-json",
  "author": "Melanys Figueredo",
  "version": "0.1.0"
}

melanyss

// submit is an action performed ON THE FORM ITSELF...
// probably best to give the form an ID attribute and refer to it by that
$('form').submit( function (event) {
	// prevent the usual form submission behaviour; the "action" attribute of the form
	event.preventDefault();
	// validation goes below...

	// now for the big event
	$.ajax({
	  // the server script you want to send your data to

melanyss

Check if and which key was pressed
$(function() {
    $(document).keypress(function(e){
        switch(e.which){
        // "ENTER"
        case 13:
        alert('enter pressed');
        break;

        // "s"

melanyss

<!--
      WebGL particle head for a clients website. 
      See the full result on fremtidenshoder.no. 
      Made with three.js
-->

<div class="particlehead"></div>
<h1><strong>WebGL</strong> head made <em>of</em> particles</h1>

melanyss

ASCII-art folder structure diagram in semantic markup + CSS

A Pen by Patrick H. Lauke on CodePen.

License.

melanyss

<nav class="menu js-menu-items-wrapper">
  <ol class="js-menu-items-list">
    <li class="menu-item js-menu-item is-active" data-morph="M 418.1,159.8 C 460.9,222.9 497,321.5 452.4,383.4 417.2,432.4 371.2,405.6 271.3,420.3 137.2,440 90.45,500.6 42.16,442.8 -9.572,381 86.33,289.1 117.7,215.5 144.3,153.4 145.7,54.21 212.7,36.25 290.3,15.36 373.9,94.6 418.1,159.8 Z"><a href="#0">Home</a></li>
    <li class="menu-item js-menu-item" data-morph="M 402.7,215.5 C 433.9,280.4 488.1,367.2 447.7,426.8 410.1,482.2 316.7,460.2 249.7,460.6 182.8,461.1 88.08,485.5 51.26,429.5 10.29,367.3 73.19,279.4 106.9,213 141.8,144 176.6,33.65 253.9,33.7 332.2,33.75 368.8,144.9 402.7,215.5 Z"><a href="#0">About</a></li>
    <li class="menu-item js-menu-item" data-morph="M 451.5,185.8 C 441.5,266.2 339.6,305 272.3,350.2 207.7,393.6 226.7,444.7 182.6,447.9 132.8,451.4 83.97,399.9 66.37,353.1 34.6,268.4 41.16,141.8 112,85.44 186.1,26.329999999999984 313.8,54.099999999999994 396,101.4 425.2,118.2 455.6,152.4 451.5,185.8 Z">
      <a href="#0