Skip to content

Instantly share code, notes, and snippets.

simurai simurai

Block or report user

Report or block simurai

Hide content and notifications from this user.

Learn more about blocking users

Contact Support about this user’s behavior.

Learn more about reporting abuse

Report abuse
View GitHub Profile
View how to screencapture and make animated gifs or

Screencapture and animated gifs

I say "animated gif" but in reality I think it's irresponsible to be serving "real" GIF files to people now. You should be serving gfy's, gifv's, webm, mp4s, whatever. They're a fraction of the filesize making it easier for you to deliver high fidelity, full color animation very quickly, especially on bad mobile connections. (But I suppose if you're just doing this for small audiences (like bug reporting), then LICEcap is a good solution).

Capturing (Easy)

  1. Launch quicktime player
  2. do Screen recording

screen shot 2014-10-22 at 11 16 23 am

afabbro /
Created Sep 21, 2012
Webkit Pseudo-Element Selectors (Shadow DOM Elements)

An ongoing project to catalogue all of these sneaky, hidden, bleeding edge selectors as I prepare my JSConf EU 2012 talk.

Everything is broken up by tag, but within each the selectors aren't particularly ordered.

I have not tested/verified all of these. Have I missed some or got it wrong? Let me know. - A

A friendly reminder that you may need to set this property on your target/selected element to get the styling results you want:



CSS Wishlist

Pseudo elements

  • Allow them to be animated (already works in Firefox, soon also in WebKit).
  • Allow more than 2 pseudo elements. Maybe we don't need it if Web Components will come.

Pseudo selectors

  • Once an element has display: none, it shouldn’t affect first/last-child and other pseudo selectors. Or maybe it makes sense to add something like display: removed. It would behave like when that element is removed from the DOM aka make pseudo selectors ignore them. Use case: When you temporarly wanna remove items in a list, see demo, but keep the design intact.


lensco / Custom.css
Created Aug 18, 2011
User stylesheet to customize the WebKit Inspector (cleaning up and improving the styles panel). See
View Custom.css
.monospace {
font: 11px/1.3 Monaco !important;
/* slightly larger indentation of source code */
.outline-disclosure ol {
-webkit-padding-start: 18px !important;
/* margin underneath styles panel heading */
bebraw /
Created Jan 6, 2011
List of JS game engines. You can find a wikified version at Feel free to modify that. I sync it here every once in a while.

IMPORTANT! Remember to check out the wiki page at for the most up to date version. There's also a "notes" column in the table but it simply does not fit there... Check out the raw version to see it.

This table contains primarily HTML5 based game engines and frameworks. You might also want to check out the [[Feature Matrix|Game-Engine-Feature-Matrix]], [[Game Resources]] and [[Scene Graphs]].

Name Size (KB) License Type Unit Tests Docs Repository Notes
Akihabara 453 GPL2, MIT Classic Repro no API github Intended for making classic arcade-style games in JS+HTML5
AllBinary Platform Platform Dependent AllBinary 2D/2.5D/3D n
You can’t perform that action at this time.