When the background logo is replaced with HTML image element per my earlier article, the same image is going to appear on every device. What if you want to swap it with a high res version on retina devices?
In this article I show how Foundation's Interchange can be loaded in WordPress and used to replace a non-retina version of the logo (as set up per my earlier tutorial) in Genesis with a retina version.
Interchange uses media queries to dynamically load responsive content that is appropriate for different users' browsers.
Step 1
Go to http://foundation.zurb.com/develop/download.html#customizeFoundation, uncheck "All Foundation Components", scroll down to "JAVASCRIPT COMPONENTS:", tick "Interchange" and download a custom build of Foundation.
Step 2
Extract the zip file and upload foundation.interchange.js and foundation.js inside js/foundation to your child theme's 'js' directory (create if not existing)
Step 3
Create a file named say, global.js in the same location on your server (where you have uploaded the js files in the earlier step) having the following:
To view the full content, please sign up for the membership.
Already a member? Log in below or here.
a basic question
Can i use the principle for adding data interchange also use it for other zurb components
thanx
Jan
Is the Zurb interchange function more or less the same as Mobble
https://wordpress.org/plugins/mobble/installation/