Pens from codetrail https://codepen.io/codetrail/ en nospam@codepen.io Copyright 2024 2019-03-26T14:31:49-07:00 Random Full-Screen Images from Unsplash https://codepen.io/codetrail/pen/aMxMMr https://codepen.io/codetrail/pen/aMxMMr codetrail

See the Code - See it Full Page - See Details

Get a new full-screen image from Unsplash.com every 10 seconds with this full-screen, automatic image loader. There is also manual control for those who don't want to wait. This small app allows you to change the speed of the auto refresh and choose from any collection at Unsplash.com.

]]>
Random Full-Screen Images from Unsplash 2019-03-26T14:31:49-07:00
FullScreen YouTube Video Background In Pure CSS https://codepen.io/codetrail/pen/xaPqEa https://codepen.io/codetrail/pen/xaPqEa codetrail

See the Code - See it Full Page - See Details

[Full explanatory article on my site](http://thenewcode.com/500/Use-YouTube-Videos-as-Fullscreen-Web-Page-Backgrounds).

]]>
FullScreen YouTube Video Background In Pure CSS 2018-09-07T14:37:40-07:00
Foundation Parallax Site https://codepen.io/codetrail/pen/MozpxN https://codepen.io/codetrail/pen/MozpxN codetrail

See the Code - See it Full Page - See Details

http://patterntap.com/code/parallax-site

]]>
Foundation Parallax Site 2017-07-10T14:15:39-07:00
HTML5 Audio Player https://codepen.io/codetrail/pen/yVdzom https://codepen.io/codetrail/pen/yVdzom codetrail

See the Code - See it Full Page - See Details

If you like this snippet, I explain everything in this tutorial. http://www.alexkatz.me/blog/html5-audio/building-a-custom-html5-audio-player-with-javascript/

]]>
HTML5 Audio Player 2016-12-27T15:21:55-07:00
firePlayer https://codepen.io/codetrail/pen/BQgwKx https://codepen.io/codetrail/pen/BQgwKx codetrail

See the Code - See it Full Page - See Details

An easy to customize audio player

]]>
firePlayer 2016-12-27T15:30:51-07:00
Advanced Toggler Example https://codepen.io/codetrail/pen/OREpRL https://codepen.io/codetrail/pen/OREpRL codetrail

See the Code - See it Full Page - See Details

]]>
Advanced Toggler Example 2016-10-12T19:23:13-07:00
Advanced Toggler Example https://codepen.io/codetrail/pen/PGapzM https://codepen.io/codetrail/pen/PGapzM codetrail

See the Code - See it Full Page - See Details

]]>
Advanced Toggler Example 2016-10-12T19:31:22-07:00
Multiple PhotoSwipe galleries on pagea https://codepen.io/codetrail/pen/WGrePX https://codepen.io/codetrail/pen/WGrePX codetrail

See the Code - See it Full Page - See Details

]]>
Multiple PhotoSwipe galleries on pagea 2016-09-12T15:30:00-07:00
Apple style select menu https://codepen.io/codetrail/pen/PzgKBg https://codepen.io/codetrail/pen/PzgKBg codetrail

See the Code - See it Full Page - See Details

A small experiment showing the ability of having a style value as a function of scroll. Works best with a touch based mouse (magic mouse, trackpad, etc.) or a touch screen.

]]>
Apple style select menu 2016-08-19T13:41:25-07:00
Material Design CSS Only Dropdown Menu https://codepen.io/codetrail/pen/dXrwZK https://codepen.io/codetrail/pen/dXrwZK codetrail

See the Code - See it Full Page - See Details

]]>
Material Design CSS Only Dropdown Menu 2016-08-17T22:12:16-07:00