Skip to content

Instantly share code, notes, and snippets.

Avatar
🤓

Gerben van Dijk gerbenvandijk

🤓
  • Tech Lead Frontend @ Tui Spain
  • Amsterdam, The Netherlands
View GitHub Profile
@gerbenvandijk
gerbenvandijk / WordpressShortContent.php
Last active Dec 18, 2015
Function to display a Wordpress string (e.g. post title or content) with a max number of characters.
View WordpressShortContent.php
<?php
function short_content($content,$limit) {
$content = strip_tags(html_entity_decode($content, ENT_QUOTES, "UTF-8"));
// when the content is longer then $limit, show three dots at the end
if(strlen($content) >= ($limit+3)) {
$content = substr($content, 0, $limit) . '...';
@gerbenvandijk
gerbenvandijk / ValidImg.js
Created Sep 27, 2013
Check for a valid image in HREF.
View ValidImg.js
function IsValidImageUrl(url, callback) {
jQuery("<img>", {
src: url,
error: function() { callback(false); },
load: function() { callback(true); }
});
View RGBtoHEX.js
// Function to convert RGB Color to hex
function rgbToHex(r, g, b) {
if (r > 255 || g > 255 || b > 255)
throw "Invalid color component";
return ((r << 16) | (g << 8) | b).toString(16);
}
@gerbenvandijk
gerbenvandijk / StickyScroll.js
Created Nov 19, 2013
Simple jQuery script to make part(s) of the site sticky when scrolled beyond a certain point.
View StickyScroll.js
// sticky scroll function
function ScrollNav() {
if ($(document).scrollTop() > 0) {
} else {
}
}
View retinaimg.html
<img src="myimage.jpg" data-2x="myimage-2x.jpg">
@gerbenvandijk
gerbenvandijk / clickToggle.js
Created Nov 19, 2013
jQuery function to toggle a click and run custom code on them (.toggle() always shows or hides an element, so we can't use this anymore).
View clickToggle.js
(function($) {
$.fn.clickToggle = function(func1, func2) {
var funcs = [func1, func2];
this.data('toggleclicked', 0);
this.click(function() {
var data = $(this).data();
var tc = data.toggleclicked;
$.proxy(funcs[tc], this)();
data.toggleclicked = (tc + 1) % 2;
});
@gerbenvandijk
gerbenvandijk / dynamicvideo.js
Last active Jul 18, 2019
Dynamically loading a HTML5 video element with JavaScript
View dynamicvideo.js
function loadVid(){
var videourl = 'urltoyourvideo here'; // set the url to your video file here
var videocontainer = '#videocontainer'; // set the ID of the container that you want to insert the video in
var parameter = new Date().getMilliseconds(); // generate variable based on current date/time
var video = '<video width="1102" height="720" id="intro-video" autoplay loop src="' + videourl + '?t=' + parameter + '"></video>'; // setup the video element
$(videocontainer).append(video); // insert the video element into its container
@gerbenvandijk
gerbenvandijk / VimeoAPI.js
Created Nov 19, 2013
Vimeo API events - howto
View VimeoAPI.js
// First load in the Froogaloop library
// It is important to build up your embed like this: <iframe src="https://player.vimeo.com/video/44633289?api=1&amp;player_id=vimeo" width="990" height="558" id="vimeo" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
// The ID of the iframe should be included!
var player = document.getElementById('vimeo');
// We bind an event that fires when the player is ready
Froogaloop(player).addEvent('ready', ready);
// The function that is initiated when the player is ready
@gerbenvandijk
gerbenvandijk / z-index-mixin.less
Last active Dec 13, 2019
Z-index mixin for LESS
View z-index-mixin.less
@z-index-order: 'contact', 'lightbox', 'nav';
.zindex(@elementName) {
.loop(@elementName, @counter) when (@counter > 0) {
.loop(@elementName, @counter - 1);
.pickIndex(@elementName, @counter);
}
@gerbenvandijk
gerbenvandijk / OldBrowser.js
Created Nov 19, 2013
Detect if the user has an old browser and if so, it inserts a friendly notification that not all features on the site will work, and that an upgrade is recommended.
View OldBrowser.js
// The code - first bit is all the UserAgent library.
(function(wndw) {
var Browsers, OS, Platform, Versions, browser_name, browser_version, os, platform;
Versions = {
Firefox: /firefox\/([\d\w\.\-]+)/i,
IE: /msie\s([\d\.]+[\d])/i,
Chrome: /chrome\/([\d\w\.\-]+)/i,
Safari: /version\/([\d\w\.\-]+)/i,
Ps3: /([\d\w\.\-]+)\)\s*$/i,
Psp: /([\d\w\.\-]+)\)?\s*$/i