Beer Bubbles CSS
Another random conversation led to this experiment . . . it’s animated CSS which is pretty cool but I can’t take any credit for it.
I found this example on Codepen and then mainly gutted it to make what you see below (also a minor experiment with flexbox).
See the Pen CSS Animated Beer Pour (Forked from CSS Beaker Pen) by Tom (@twwoodward) on CodePen.
Related posts
CSV to MYSQL to JS Filtered Table Tutorial
I’m not a programmer. If you’re a programmer, you don’t need me. This tutorial is written for people who are equally clueless. Notice, I am clueless. This is cobbled together from a series of different tutorials, libraries etc. I may very well have done some stuff wrong but it works. So with that warning out of the way, why might you want to do this? Speed with large(r) amounts of data. I needed a page that loaded a fairly large amount of information (~1700 rows) and then let people sort through the data quickly. It is a lot like what you can do with Exhibit but I built one version with a Google Spreadsheet backend but it was too slow. I tried pulling all that data into straight JSON and it did make it faster . . . but still too slow. So there went my tried and true methods. I considered pulling the data into WordPress which is the other way I normally cheat my way out of programming#Nonprogramistan4life even if Jim keeps blogging about APIs. 🙂 but given the information was going to change, it was likely to be more of a pain than it was worth. For the record, there are CSV to post plugins for WP that work decently. CSV to MySQL To start I had […]
RVArts – Dealing with Dates in WordPress
We have an awesome general education course starting this semester called Cultural Passport (aka RVArts). The goal is to get students involved with the community’s cultural events – participating, promoting, reviewing them. The web side of this ends up being pretty interesting. See their video below for more details on the course. When we started this conversation last year, I thought I was going to go the Gravity Form submission routeI thought I wrote a full tutorial on this but can’t find it. I often have unrealized good intentions though . . . and use a js library to make it possible to add the events to various calendars. Like most projects, particulars shifted and we started changing things pretty radically right before winter break. We ended up shooting for full WordPress editor access for students to create events and the desire to write three different types of responses (interviews, reviews, and features) that would be associated with a specific event. Also, like most projects, this was all a bit beyond what I’d ever done before. I started off thinking I’d create a custom post type for events. I was trying to make up my mind between using Advanced Custom Fields and CMB to help do that when I realized I hadn’t really thought about repeat events. The complexities involved […]
Google Scripting Folder Tricks
I often end up confused about some of the Google Script stuff so I’m putting this out there in case it helps others. The following script does a few things that you might want to do all based around a Google Form submission. It creates a folder, adds editors to the folder, puts the folder in another folder, and then copies a spreadsheet to the folder while adding some data in a few cells.
Trackbacks and Pingbacks on this post
-
-
[…] been fairly busy. That said, I’ve been meaning to play around with CSS animation thanks to Tom Woodward’s post last month featuring beer bubbles. And after talking with Bryan Mathers about more seamless animation of the artwork […]
-
- TrackBack URL
Comments on this post