drabbytux

// Use Gists to store code you would like to remember later on
console.log(window); // log the "window" object to the console

drabbytux

{% if template contains 'product' %}
{% assign size_options = 'size,taille' | split: ',' %}
{% assign size_chart_text_link = 'Size chart' %}
{% assign has_size = false %}
{% assign size_index = 0 %}
{% for option in product.options %}  
  {% assign downcased_option = option | downcase %}
  {% if has_size == false and size_options contains downcased_option %}
    {% assign has_size = true %}
    {% assign size_index = forloop.index0 %}

drabbytux

What you want

You want a See Size Chart button on the product page:

... that once clicked gives you this:

drabbytux

/*! Magnific Popup - v1.0.0 - 2015-03-30
* http://dimsemenov.com/plugins/magnific-popup/
* Copyright (c) 2015 Dmitry Semenov; */
!function(a){"function"==typeof define&&define.amd?define(["jquery"],a):a("object"==typeof exports?require("jquery"):window.jQuery||window.Zepto)}(function(a){var b,c,d,e,f,g,h="Close",i="BeforeClose",j="AfterClose",k="BeforeAppend",l="MarkupParse",m="Open",n="Change",o="mfp",p="."+o,q="mfp-ready",r="mfp-removing",s="mfp-prevent-close",t=function(){},u=!!window.jQuery,v=a(window),w=function(a,c){b.ev.on(o+a+p,c)},x=function(b,c,d,e){var f=document.createElement("div");return f.className="mfp-"+b,d&&(f.innerHTML=d),e?c&&c.appendChild(f):(f=a(f),c&&f.appendTo(c)),f},y=function(c,d){b.ev.triggerHandler(o+c,d),b.st.callbacks&&(c=c.charAt(0).toLowerCase()+c.slice(1),b.st.callbacks[c]&&b.st.callbacks[c].apply(b,a.isArray(d)?d:[d]))},z=function(c){return c===g&&b.currTemplate.closeBtn||(b.currTemplate.closeBtn=a(b.st.closeMarkup.replace("%title%",b.st.tClose)),g=c),b.currTemplate.closeBtn}

drabbytux

/*================ Vendor-specific styles ================*/
/* Magnific Popup CSS */
.mfp-bg {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1042;
  overflow: hidden;
  position: fixed;

drabbytux

---

layout: default title: Add tabs to product descriptions description: Learn product tabs. Increase your SEO and readability

difficulty: intermediate

supported: false demo_store: http://jewess-blick9504.myshopify.com/products/acadia-surf

nav: group: products

drabbytux

---

layout: default title: Allow pre-orders for products sidebar_title: Allow pre-orders description: If you have a product on back order, you can display it as pre-order only on your online Shopify store.

difficulty: intermediate

incompatible-themes: [ "Minimal", "Solo" ] supported: false

nav:

drabbytux

layout	title	description	supported	nav
default	Get customization information for products	Using line item properties to get custom information for products like monograms, engravings, or other customizations.	false	group products

drabbytux

layout	title	sidebar_title	description	nav
default	Select product variants by clicking their images	Select variants by clicking their images	Enable customers to select a product variant by clicking its image on your online Shopify store.	group products

drabbytux

{% comment %}
Place this in your product.liquid template, at the bottom.
{% endcomment %}
{% if product.variants.size > 1 %}
<script>
  var variantImages = {},
    thumbnails,
    variant,
    variantImage,
    optionValue,