title: Uncaught TypeError: Object function(a,b) has no method 'fancybox'
body: <p>The project is using fancyBox v2.0.5 with jQuery v1.7.2, and my javascript code is:</p>
  
  <pre><code>function getWeather() {
      $("body").css("cursor", "progress");
      console.log("click");
  
      url = 'index.php?model=weather_page';
      $.ajax({
          async: false,
          type: 'GET',
          url: url
      }).done(function(data) {
              $.fancybox({
                  'width'             : 850,
                  'height'            : 850,
                  'speedIn'           : 800,
                  'autoScale'         : true,
                  'transitionIn'      : 'elastic',
                  'transitionOut'     : 'elastic',
                  'easingIn'          : 'easeOutBack',
                  'easingOut'         : 'easeInBack',
                  'type'              : 'inline',
                  'scrolling'         : 'auto',
                  'closeBtn'          : true,
                  'closeClick'        : true,
                  'content'           : data,
                  'onComplete' : function(){
                      $.fancybox.resize();
                  },
              });
              $("body").css("cursor", "auto");
          });
  }
  </code></pre>
  
  <p>Which is run at the onclick event:</p>
  
  <pre><code>&lt;div id="miniWeatherBlock" onclick="getWeather()"&gt;
      // data for mini-weather block
  &lt;/div&gt;
  </code></pre>
  
  <p>The event runs fine when I first click it, it loads the data returned from the AJAX in a fancybox pop-up. However after I close this then click on the same miniWeatherBlock again, it doesn't load a pop-up and in the console I get the error:</p>
  
  <blockquote>
    <p>Uncaught TypeError: Object function (a,b){return new e.fn.init(a,b,h)}
    has no method 'fancybox'</p>
  </blockquote>
  
  <p>At line where I use <code>$.fancybox({</code></p>
  
  <p>Any ideas what's wrong?</p>
  
  <p><strong>EDIT:</strong>
      
          // snippet of head
      </p>
  
  <pre><code>&lt;script src="js/jquery.fancybox.pack.js"&gt;&lt;/script&gt;
  
  &lt;script src="js/functions.js"&gt;&lt;/script&gt;
  &lt;/head&gt;
  </code></pre>
  
  <p>Inside <code>js/functions.js</code> - I have the getWeather() function.</p>
  
  <p>Other instances of fancybox work perfectly fine, for example, this is also inside the <code>js/functions.js</code> file:</p>
  
  <pre><code>$(".fancybox-information").fancybox({
      'width'             : 720,
      'height'            : 1300,
      'speedIn'           : 800,
      'autoScale'         : true,
      'transitionIn'      : 'elastic',
      'transitionOut'     : 'elastic',
      'easingIn'          : 'easeOutBack',
      'easingOut'         : 'easeInBack',
      'type'              : 'iframe',
      'scrolling'         : 'no',
      'closeBtn'          : true,
      'closeClick'        : true
  });
  </code></pre>
  
  <p>Which works fine when the page has elements with the class <code>fancybox-information</code></p>