stanwmusic

<div class="mhn-player">
<div class="album-art"></div>
<div class="play-list">
	<a href="#" class="play"
		data-id="1"
		data-album="Peace Pipe"
		data-artist="Stan Williams"
		data-title="Peace Pipe"
		data-albumart="http://k007.kiwi6.com/hotlink/aq9oct1t26/Sounds-better-Loud-Partial-mp3-image.jpg"
		data-url="http://k007.kiwi6.com/hotlink/13lh1ifeoo/PeacePipe.mp3"></a>

stanwmusic

Christmas animation

Animated Christmas card made using GSAP.

A Pen by Stan Williams on CodePen.

License.

stanwmusic

    <div id="app"></div>

stanwmusic

Campfire with Cat and Dog: Pure CSS (no SVGs!)

A Pen by Stan Williams on CodePen.

License.

stanwmusic

Contract Killer

The popular open-source contract for web professionals by Stuff & Nonsense

• Originally published: 23rd December 2008
• Revised date: March 15th 2016
• Original post

---

stanwmusic

Audio Player from Video.js

This is the base skin of Video.js that can be modified to make custom skins.

The great thing about Video.js skins is they work in both HTML5 video AND Flash!

A Pen by Stan Williams on CodePen.

License.

stanwmusic

<script>
  function play(){
       var audio = document.getElementById("audio");
       audio.play();
                 }
   </script>

<div class="center"><img src="https://ia800604.us.archive.org/21/items/78_boogie-woogie-music-vol.-2_meade-lux-lewis-shayne_gbia0003369/78_boogie-woogie-music-vol.-2_meade-lux-lewis-shayne_gbia0003369_itemimage.jpg?cnt=0" value="PLAY"  onclick="play()">
<audio id="audio" src="https://archive.org/download/78_boogie-woogie-music-vol.-2_meade-lux-lewis-shayne_gbia0003369/Boogie%20Woogie%20-%20Charlie%20Segar%20-%20Pinetop%20Smith.mp3" ></audio></div>
<h3><strong>Click record to play</strong></h3>

stanwmusic

I added this to Atom's styles.less file so I could more easily grab the scrollbar with the mouse. 
As it was it was almost unuseable to me and I realized that I was often  opening files I wished to edit in a different 
editor rather that fighting with it.
I added somestyling to make it more toi l=my liking. I may still tweak  the colors or opacity some more. 
If you use this you can change the width, height, color and opacity to suit your  own personal preference.

Copy and paste in  the bottom of your styles.less  file in Atom.
It may be an empty file and if so just add this and  save it. (ctrl + s).
Change it to suit yourself.

stanwmusic

ColorPicker tool

A Pen by Stan Williams on CodePen.

License.

stanwmusic

Type your answer to the presented equation before the time expires.

—