Skip to content

Instantly share code, notes, and snippets.

View Schepp's full-sized avatar

Christian Schaefer Schepp

333 followers · 2 following
View GitHub Profile
@Schepp
Schepp / lazy-unload-iframes.js
Created June 10, 2025 21:34
(() => {
const loadedIframes = []; // Holds { el, originalSrc }
document.addEventListener(
"load",
(event) => {
const iframe = event.target;
if (!iframe.matches('iframe[loading="lazy"]')) return;
@Schepp
Schepp / CSS masking.md
Created November 30, 2018 12:33

Almost one year ago I wrote an article that dealt with an emerging WebKit CSS technique, the CSS filter effects, and the question if we could not have/emulate them in other browsers, too. Turned out we could.

Today I want to talk about another WebKit-only feature and show you how you might be able to use it across all of the browsers: This is about…

CSS Masks

CSS masks were added to the WebKit engine by Apple quite a while ago, namely back in April 2008. Masks offer the ability to control the opacity/transparency of elements on a per-pixel basis, similar to how the alpha/transparency-channel of "24-bit"-PNGs or 32-bit-TIFFs work.

[![RGBA](/content/home/003-css-masking/rgba.jpg)](/content/home/003-css-masking/rgba.jpg)
@Schepp
Schepp / inputmode-detect-and-track.js
Created April 25, 2019 11:37
(function () {
var previousInputMode = false;
var inputMode = (function() {
try {
var inputMode = window.sessionStorage.getItem('inputMode');
if (!inputMode) {
return undefined;
}
if (window.ga) {
window.ga('set', 'dimension1', inputMode);
@Schepp
Schepp / gist:9323419
Created March 3, 2014 11:47
prefetch supported: yes
parallel prefetch requests: 9
prefetch canceled on page transition: yes
prefetch delayed until after onload: no
prefetch lower priority than images: no
prefetch link seen by preloader: no
dns-prefetch supported: not tested
prerender supported: no
prerender JS executed twice: no
@Schepp
Schepp / wwnrw-threejs-workshop-material.md
Last active February 22, 2017 13:20
Links zu dem Material des three.js-Workshops bei den Webworkern NRW am 21.02.2017
@Schepp
Schepp / gist:8036427
Created December 19, 2013 09:02
Bookmarklet that allow you to copy its output URL and insert that into a Twitter DM, without being blocked.
javascript:prompt('Copy this:',location.href.replace(/\./g,"\u200b."));return false;
@Schepp
Schepp / gist:7802899
Created December 5, 2013 10:00
Configure TinyMCE in a way that it filters out Word tagsoup
tinyMCE.init({
mode : "exact",
theme : "advanced",
language : "de",
valid_elements : "p,em/i,strong/b,br,strike,u,ul,ol,li",
theme_advanced_buttons1 : "undo,redo,bold,italic,underline,strikethrough,bullist,numlist,outdent,indent,code",
theme_advanced_buttons2 : "",
theme_advanced_buttons3 : "",
apply_source_formatting : true,
entity_encoding : "named",
@Schepp
Schepp / gist:6338742
Last active December 21, 2015 17:09
Send CORS headers for CSS files only

Put this into the server's .htaccess file (assuming that it's an Apache):

<IfModule mod_headers.c>
  <FilesMatch "\.css$">
    Header set Access-Control-Allow-Origin "*"
  </FilesMatch>
</IfModule>
@Schepp
Schepp / gist:6304539
Created August 22, 2013 08:26
How to set IE compatibility mode via entry in Apache's .htaccess
<IfModule mod_headers.c>
# Set IE to render page as if it were an IE 7
Header set X-UA-Compatible "IE=7"
</IfModule>
@Schepp
Schepp / gist:5638708
Created May 23, 2013 19:20
# This .htaccess needs Apache with:
# mod_rewrite
# mod_headers
# mod_proxy
# SSL certificate
# Proxies "https://api.twitter.com.cors-proxy.io/1.1/statuses/mentions_timeline.json?count=2&since_id=14927799"
# To: "https://api.twitter.com/1.1/statuses/mentions_timeline.json?count=2&since_id=14927799"
# All while setting CORS header on the fly