Skip to content

Instantly share code, notes, and snippets.

View lutzissler's full-sized avatar

Lutz Issler lutzissler

5 followers · 0 following
View GitHub Profile
@lutzissler
lutzissler / jquery.realwidth.js
Created October 14, 2013 12:50
jQuery realWidth plugin. Returns the real (sub-pixel, non-rounded) width of an element as stored internally in the browser. Thanks to ssorallen for the hint. See http://stackoverflow.com/questions/3603065/do-not-round-width-in-jquery#16072668 for context.
(function ($) {
$.fn.realWidth = function () {
var els = $(this);
return els.length ? els[0].getBoundingClientRect().width : null;
}
})(jQuery);
@lutzissler
lutzissler / func.waitForWebfonts.js
Created October 15, 2013 13:34
Fire a callback when all provided webfonts have been loaded. Based on work by Thomas Bachem (http://stackoverflow.com/questions/4383226/using-jquery-to-know-when-font-face-fonts-are-loaded#11689060).
function waitForWebfonts(fonts, callback) {
var loadedFonts = 0;
for(var i = 0, l = fonts.length; i < l; ++i) {
(function(font) {
var node = document.createElement('span');
// Characters that vary significantly among different fonts
node.innerHTML = 'giItT1WQy@!-/#';
// Visible - so we can measure it - but not on the screen
node.style.position = 'absolute';
node.style.left = '-10000px';
@lutzissler
lutzissler / function.createSlug.php
Last active January 24, 2023 10:48
PHP port of https://github.com/simov/slugify.
function slugify($s, $replacement = '-', $locale = null, $lower = false, $trim = true) {
$charMap = json_decode('{"$":"dollar","%":"percent","&":"and","<":"less",">":"greater","|":"or","¢":"cent","£":"pound","¤":"currency","¥":"yen","©":"(c)","ª":"a","®":"(r)","º":"o","À":"A","Á":"A","Â":"A","Ã":"A","Ä":"A","Å":"A","Æ":"AE","Ç":"C","È":"E","É":"E","Ê":"E","Ë":"E","Ì":"I","Í":"I","Î":"I","Ï":"I","Ð":"D","Ñ":"N","Ò":"O","Ó":"O","Ô":"O","Õ":"O","Ö":"O","Ø":"O","Ù":"U","Ú":"U","Û":"U","Ü":"U","Ý":"Y","Þ":"TH","ß":"ss","à":"a","á":"a","â":"a","ã":"a","ä":"a","å":"a","æ":"ae","ç":"c","è":"e","é":"e","ê":"e","ë":"e","ì":"i","í":"i","î":"i","ï":"i","ð":"d","ñ":"n","ò":"o","ó":"o","ô":"o","õ":"o","ö":"o","ø":"o","ù":"u","ú":"u","û":"u","ü":"u","ý":"y","þ":"th","ÿ":"y","Ā":"A","ā":"a","Ă":"A","ă":"a","Ą":"A","ą":"a","Ć":"C","ć":"c","Č":"C","č":"c","Ď":"D","ď":"d","Đ":"DJ","đ":"dj","Ē":"E","ē":"e","Ė":"E","ė":"e","Ę":"e","ę":"e","Ě":"E","ě":"e","Ğ":"G","ğ":"g","Ģ":"G","ģ":"g","Ĩ":"I","ĩ":"i","Ī":"i","ī":"i","Į":"I",
@lutzissler
lutzissler / jquery.scrollstop.js
Created November 12, 2013 13:32
Scroll stop event for jQuery. Remember that scroll events don’t bubble, so this will only catch full page scrolls.
(function($) {
var timer;
$(window).bind("scroll", function (e) {
clearTimeout(timer);
timer = setTimeout(function () {
$(window).trigger("scrollstop");
}, 150);
});
})(jQuery);
@lutzissler
lutzissler / spread.css
Created November 15, 2013 18:55
Spread items evenly across the full width. Full credit to daniel (see http://stackoverflow.com/questions/5060923/how-to-stretch-html-css-horizontal-navigation-items-evenly-and-fully-across-a#17951253 for his StackOverview post where he explains this technique).
#nav {
text-align: justify;
min-width: 500px;
}
#nav:after {
content: '';
display: inline-block;
width: 100%;
}
#nav li {
@lutzissler
lutzissler / jquery.contains-caseinsensitive.js
Created December 14, 2013 12:19
Case-insensitive :Contains selector for jQuery >= 1.3. Taken from http://stackoverflow.com/questions/187537/is-there-a-case-insensitive-jquery-contains-selector#187557 (thanks to @pat and @user95227).
jQuery.expr[':'].Contains = function(a,i,m) {
return (a.textContent || a.innerText || "").toUpperCase().indexOf(m[3].toUpperCase()) >= 0;
};
@lutzissler
lutzissler / custom-bullets.sass
Last active August 13, 2019 18:52
SASS mixin for using some arbitrary text as list bullet (use it with symbol fonts!).
@mixin custom-bullet($bulletText: ">", $indentWidth: 20px) {
padding-left: $indentWidth;
position: relative;
&:before {
content: $bulletText;
position: absolute;
margin-left: -$indentWidth;
}
}
@lutzissler
lutzissler / func.get_video_embed_url.php
Last active February 14, 2017 11:53
Takes a Vimeo or YouTube URL and returns the iframe embed URL. Other URLs remain untouched.
function get_video_embed_url($url) {
// Check for YouTube
$matchFound = preg_match('/^(https?:\/\/(www\.)?youtube\.com\/watch\?(t=(.+)&)?v=|https?:\/\/youtu\.be\/)([^?]+)(\?(t=(.+))?.*)?$/', $url, $matches);
if ($matchFound) {
// Video is a Youtube video
$url = '//www.youtube.com/embed/' . $matches[5];
if ($matches[4]) {
$url = $url . '?start=' . $matches[4];
} else if ($matches[8]) {
$url = $url . '?start=' . $matches[8];
@lutzissler
lutzissler / jquery.hiddenscroll.js
Created September 6, 2014 06:33
Feature test for hidden scrollbars (e. g. on Mac OS). Adopted from http://davidwalsh.name/detect-scrollbar-width and https://github.com/Modernizr/Modernizr/blob/d6e1d6f09e1f8250eca9116bcffe2f846616afa7/feature-detects/hiddenscroll.js. Usage: Plug it in and see the class "hiddenscroll" being added to the html element if scrollbars are hidden.
(function ($) {
$(function () {
var el = $('<div style="width:100px;height:100px;overflow:scroll;position:absolute;top:-9999px;"/>'),
elDom = el.get(0);
el.appendTo("body");
if (elDom.offsetWidth === elDom.clientWidth) {
$("html").addClass("hiddenscroll");
}
el.remove();
});
@lutzissler
lutzissler / jquery.partition.js
Created October 28, 2014 16:23
Little jQuery plugin for spreading, or “partitioning“, elements across several parent elements. Called to create `n` partitions, the plugin wraps the selected elements at positions `c`, `n+c`, `2n+c`, `3n+c`, … into “wrapper” element for all `c` within `1`…`n`.
(function ($) {
$.fn.partition = function(options) {
options = $.extend({
count: false,
wrapper : '<div>'
}, options || {});
var elems = $(this),
len = pos = 0;
for (var i = 0; i < options.count; i++) {
var sel = elems.filter(":nth-child(" + (options.count - i) + "n)");