Papermashup

Latest Posts


Subscribe


Tweets


"@bethgordon @KBedders @elerichardson manners!"

@ashleyford 1 week ago

"Pulling a full moonie with @bethgordon @KBedders @elerichardson https://t.co/kb7RSWeGjG"

@ashleyford 1 week ago
Papermashup

Web design and development tutorials, scripts and downloads designed for beginners right through to advanced developers


jquery10

Build a music sequencer with jQuery

I’ve been fascinated over the last few days by sampulator, a great little project by @stevespaced that allows you to sequence sounds to build up a song. After a bit of research I came across this code by Joe Harry which uses the Howler.js audio library to sequence and play the sounds. The sequencer is based on the Yamaha’s [...]

AshleyAshley

jQuery product comparison plugin

Here’s a simple way for customers to be able to compare products to help them make a purchase decision. In the demo you select which products you want to compare and hit the ‘compare’ button which displays a fullscreen modal displaying  further information about the products. Let’s delve into the code. For this example [...]

AshleyAshley

The jQuery Animate Method Explained

One of the most fun parts of working with the web is animating elements on a web page. For animations, not only do we have to understand the effects across different devices, but also the elements that change the visibility, and properties, either at a particular time or in response to an event, for example altering the size of an element [...]

MubashirMubashir

Mini Javascript Clock with jQuery

I was working on an interesting project where I thought a mini javascript clock would be awesome to display a user inputed time. I’m yet to fully implement it into the project at the time of writing but I wanted to share it. The HTML Simply setup the .clock div with our hands inside. You set the time for the clock using the data-hour [...]

AshleyAshley

Create an Animated Timeline with jQuery

I’ve been meaning to write about this plugin for some time but never got around to it until now! This great plugin written by csslab.cl helps you beautifully present timelines and has support for both horizontal and vertical layouts. jQuery Timelinr After including the timelinr.js plugin file, to get it working all you need to do is [...]

AshleyAshley

jQuery dynamic number ticker

This is a fascinating little script that helps you display a dynamic JSON feed of numbers that automatically updates on the page by animating up or down to the current number. A great addition as part of a realtime analytical dashboard. The Code There are three functions in total. The first one ‘format_number’ which works the same [...]

AshleyAshley

Automatic jQuery site subscription lightbox

I’ve had many of you email me asking for a tutorial that shows how to create the subscription lightbox that used to activate the first time you visit the site, and I’ve finally got around to writing it up. Getting Started You’ll need to include the jQuery library as well as the Colorbox lightbox JS and CSS which are included [...]

AshleyAshley

jQuery Fancy Switch

I wrote a post a while back on coding an iPhone style switch using jQuery. I’ve now put together a simple tutorial demonstrating how simple it is to build a switch that triggers two radio buttons in a field set. It also degrades gracefully if JavaScript is disabled just displaying the two radio buttons with labels. This tutorial is aimed [...]

AshleyAshley

jQuery Show / Hide Plugin

Due to popular demand here’s a re-written version of the tutorial I wrote over a year ago on how to show and hide content using jQuery. After I first published the post I’ve had a lot of requests as to how you can show and hide multiple divs so I’ve written this plugin which does all the work for you! The Plugin The Usage [...]

AshleyAshley