Skip to content

Instantly share code, notes, and snippets.

View gerbenvandijk's full-sized avatar
🤓

Gerben van Dijk gerbenvandijk

🤓
  • Tech Lead Frontend @ Foodticket
  • Amsterdam, The Netherlands
View GitHub Profile
@gerbenvandijk
gerbenvandijk / Mark parent navigation active when on custom post type single page
Last active January 1, 2024 21:22
Mark (highlight) custom post type parent as active item in Wordpress Navigation.When you visit a custom post type's single page, the parent menu item (the post type archive) isn't marked as active. This code solves it by comparing the slug of the current post type with the navigation items, and adds a class accordingly.
<?php
function add_current_nav_class($classes, $item) {
// Getting the current post details
global $post;
// Get post ID, if nothing found set to NULL
$id = ( isset( $post->ID ) ? get_the_ID() : NULL );
@gerbenvandijk
gerbenvandijk / OldBrowser.js
Created November 19, 2013 09:56
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.
// 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
@gerbenvandijk
gerbenvandijk / z-index-mixin.less
Last active December 13, 2019 07:03
Z-index mixin for LESS
@z-index-order: 'contact', 'lightbox', 'nav';
.zindex(@elementName) {
.loop(@elementName, @counter) when (@counter > 0) {
.loop(@elementName, @counter - 1);
.pickIndex(@elementName, @counter);
}
@gerbenvandijk
gerbenvandijk / VimeoAPI.js
Created November 19, 2013 13:46
Vimeo API events - howto
// 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 / dynamicvideo.js
Last active July 18, 2019 06:01
Dynamically loading a HTML5 video element with JavaScript
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 / clickToggle.js
Created November 19, 2013 09:54
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).
(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 / retinaimg.html
Created December 9, 2013 09:49
Simple retina <img>
<img src="myimage.jpg" data-2x="myimage-2x.jpg">
@gerbenvandijk
gerbenvandijk / StickyScroll.js
Created November 19, 2013 10:07
Simple jQuery script to make part(s) of the site sticky when scrolled beyond a certain point.
// sticky scroll function
function ScrollNav() {
if ($(document).scrollTop() > 0) {
} else {
}
}
@gerbenvandijk
gerbenvandijk / RGBtoHEX.js
Created November 19, 2013 10:09
RGB to HEX
// 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 / ValidImg.js
Created September 27, 2013 10:26
Check for a valid image in HREF.
function IsValidImageUrl(url, callback) {
jQuery("<img>", {
src: url,
error: function() { callback(false); },
load: function() { callback(true); }
});