Skip to content

Instantly share code, notes, and snippets.

@synecdocheNORTH
synecdocheNORTH / script.js
Created January 26, 2019 17:45
Wavy Road with Dashes
// Asked by @jrf0110
// https://github.com/jonobr1/two.js/issues/120
var two = new Two({
type: Two.Types.canvas,
fullscreen: true,
autostart: true
}).appendTo(document.body);
/**
@synecdocheNORTH
synecdocheNORTH / index.html
Created January 13, 2019 01:22
Mouse driven carrousel concept
<div id="wrap">
<a href="#" class="hb">
<div class="c">
<img src="https://source.unsplash.com/user/web_tiki/2000x1300" alt=""/>
<div class="txt">
<h1>Title here</h1>
<p>Some longer text here thats wide enough to span on several lines.</p>
</div>
</div>
</a>
@synecdocheNORTH
synecdocheNORTH / index.html
Created January 9, 2019 20:02
Opening Advent Calendar Door
<h2>Click on the red door to open it</h2>
<div class="door-frame">
<div class="door"></div>
<div class="star"></div>
</div>
@synecdocheNORTH
synecdocheNORTH / script.babel
Created January 9, 2019 19:56
Three.js Smoke Cloud
let cam, scene, renderer,
clock, smokeMaterial,
h, w,
smokeParticles = [];
const animate = () => {
let delta = clock.getDelta();
requestAnimationFrame(animate);
@synecdocheNORTH
synecdocheNORTH / script.js
Created January 9, 2019 19:55
Three Js Point Cloud Experiment
(function() {
'use strict';
// 'To actually be able to display anything with Three.js, we need three things:
// A scene, a camera, and a renderer so we can render the scene with the camera.'
// - https://threejs.org/docs/#Manual/Introduction/Creating_a_scene
var scene, camera, renderer;
// I guess we need this stuff too
var container, HEIGHT,
@synecdocheNORTH
synecdocheNORTH / index.html
Created January 7, 2019 18:29
Scrolling Golden Spiral
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<div class="js-spiral">
<div class="js-section">
<div class="message">
Scroll, Use Arrow Keys or Click<br><br>