Skip to content

Instantly share code, notes, and snippets.

Stephan van Opstal st3phan

Block or report user

Report or block st3phan

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
@st3phan
st3phan / index.html
Last active Dec 26, 2015
Nested checkboxes. Do not return parents checkboxes when it has child checkboxes checked.
View index.html
<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
<meta charset=utf-8 />
<title>JS Bin</title>
</head>
<body>
<ul id="thingy">
<li><span><input type="checkbox" checked /></span>
@st3phan
st3phan / phantom.js
Created Dec 4, 2012
Creating screenshots of HTML elements using PhantomJS
View phantom.js
var page = require('webpage').create();
page.open('/url', function () {
var items = ['selector1', 'selector2', 'selector3'];
var items_length = items.length;
for (var i = 0; i < items_length; i++) {
var clipRect = page.evaluate(function (s) {
var cr = document.querySelector(s).getBoundingClientRect();
return cr;
@st3phan
st3phan / countdown timer
Created Nov 22, 2012 — forked from Squizzer/countdown timer
A html/js countdown timer with some comments to help you :)
View countdown timer
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
function cdtd() {
var wo = new Date("August 13, 2013 10:30:30");
var now = new Date();
var timeDiff = wo.getTime() - now.getTime();
if (timeDiff <= 0) {
@st3phan
st3phan / gist:4078229
Created Nov 15, 2012 — forked from pixelpogo/gist:1222411
How to simulate low bandwidth on mac os x
View gist:4078229
# try
# 48kbit/s for Dialup
# 64kbit/s for Edge
# 384kbit/s for 3G
# 768kbit/s for DSL
# 1572kbit/s for T1
#
# to simulate low bandwidths.
#
# And: You can play with the delay option.
@st3phan
st3phan / _shared.scss
Created Jun 18, 2012 — forked from rickharris/_shared.scss
Media queries with IE support using Sass 3.2 features
View _shared.scss
// Using this structure, this file should be your canonical stylesheet where
// everything would be imported into, so that you can just `@import "shared";`
// in both your normal and IE stylesheets, only having to add libraries and
// such in one place.
// These styles are just a contrived example.
body {
font-size: 18px;
@include respond-to(desktops) {
color: blue;
@st3phan
st3phan / _shared.scss
Created Jun 4, 2012 — forked from rickharris/_shared.scss
Media queries with IE support using Sass 3.2 features
View _shared.scss
// Using this structure, this file should be your canonical stylesheet where
// everything would be imported into, so that you can just `@import "shared";`
// in both your normal and IE stylesheets, only having to add libraries and
// such in one place.
// These styles are just a contrived example.
body {
font-size: 18px;
@include respond-to(desktops) {
color: blue;
@st3phan
st3phan / hack.sh
Created Mar 31, 2012 — forked from erikh/hack.sh
OSX For Hackers
View hack.sh
#!/usr/bin/env sh
##
# This is script with usefull tips taken from:
# https://github.com/mathiasbynens/dotfiles/blob/master/.osx
#
# install it:
# curl -sL https://raw.github.com/gist/2108403/hack.sh | sh
#
@st3phan
st3phan / dabblet.css
Created Mar 26, 2012 — forked from jakearchibald/dabblet.css
Transitioning via translate (uses sub-pixel == smoother)
View dabblet.css
.test, .test2 {
width: 200px;
height: 200px;
background: green;
border-radius: 500px;
position: relative;
transition: all 2s linear;
}
.test2:hover {
transform: translate(20px, 0);
View jquery.images-loader-deferred.js
// deferred obj callback
function loadImg(selector) {
var dfd = $.Deferred();
$(selector).load(function() { dfd.resolve(); });
return dfd.promise();
}
// more elements
$.when(
loadImg('#img1'),
@st3phan
st3phan / dabblet.css
Created Jan 4, 2012 — forked from kizu/dabblet.css
Centered heading with rules
View dabblet.css
/* Centered heading with rules */
h1 {
position: relative;
overflow: hidden;
white-space: nowrap;
text-align: center;
text-overflow: ellipsis;
font: 1.6em/1.1 Georgia;
padding: .2em 0;
You can’t perform that action at this time.