title: featherlight.js tagetAttr and autostart function
body: <p>I was wondering about the purpose of the following attribute of the default configuration object. As per documentation on github:</p>
  
  <blockquote>
    <p>By default, Featherlight initializes all elements matching defaults.selector on document ready. If you want to prevent this, set $.featherlight.defaults.autostart to false before the DOM is ready.</p>
  </blockquote>
  
  <p>And under "Bind featherlight section":</p>
  
  <blockquote>
    <p>It will then look for the targetAttr (by default "data-featherlight") on this element and use its value to find the content that will be opened as lightbox when you click on the element.</p>
  </blockquote>
  
  <p>Give the above two, I am trying to:</p>
  
  <ol>
  <li>Stop featherlight from loading and initializing itself on startup</li>
  <li>Instead of using data-featherlight-xxx attributes, use data-my-lightbox-xxx attributes. </li>
  </ol>
  
  <p>So I did the following:</p>
  
  <p>In my javascript, before the onReady() function, I added:</p>
  
  <pre><code>$.featherlight.defaults.autostart=false;
  </code></pre>
  
  <p>and </p>
  
  <pre><code>$.featherlight.defaults.targetAttr='data-my-lightbox';
  </code></pre>
  
  <p>However, setting the autostart to false doesn't seem to have any effect. If I look at the source, I don't see any reference to it either. There is an 'autoBind' variable though.</p>
  
  <p>Next, I tried setting the data-my-lightbox attribute on the anchor tag:</p>
  
  <pre><code>&lt;a href="#" data-my-lightbox="my-image-gallery.html" ...&gt; 
  </code></pre>
  
  <p>and  also tried:</p>
  
  <pre><code>&lt;a href="my-image-gallery.html" data-my-lightbox="iframe" ...&gt;
  </code></pre>
  
  <p>but it seems like this is being ignored as well. Until I did the following:</p>
  
  <pre><code>$('[data-my-lightbox]').featherlight();
  </code></pre>
  
  <p>In a way that seems logical, but I was under the impression that if I change the default attribute before onReady, the rest would fall into place. Then I discovered the autoBind variable (before onReady()):</p>
  
  <pre><code>$.featherlight.autoBind='[data-my-lightbox]';
  $.featherlight.defaults.targetAttr='data-my-lightbox';
  </code></pre>
  
  <p>that works without requiring the explicit $(..).featherlight construct. All good so far.</p>
  
  <p>However, it seems that the width/height attributes for the iFrame should still be data-featherlight-xxxxx instead of data-my-lightbox-xxxx..perhaps attributed to the following line in source:</p>
  
  <pre><code>var match = this.name.match(/^data-featherlight-(.*)/);
  </code></pre>
  
  <p>What if I change that to something like:</p>
  
  <pre><code>var matchRegEx = RegExp("^"+targetAttr+"-(.*)"); 
  var match = this.name.
  </code></pre>
  
  <p>and update the code in relevant places?</p>
  
  <p>Thank you for your help and assistance.</p>