title: foundation tooltip is not working. Any idea on this subject?
body: <p>the foundation tooltip is not working . I think the script placement is wrong but i could not figure out what the actual problem is. does the tooltip has to be initialized for javascript or is it based on CSS only?</p>
  
  <p>this is the script i have placed just above the closing body tag</p>
  
  <pre><code>&lt;script&gt;
    document.write('&lt;script src=' +
    ('__proto__' in {} ? 'js/vendor/zepto' : 'js/vendor/jquery') +
    '.js&gt;&lt;\/script&gt;')
    &lt;/script&gt;
  
    &lt;script src="js/foundation.min.js"&gt;&lt;/script&gt;
    &lt;script src="../js/foundation/foundation.section.js"&gt;&lt;/script&gt;
    &lt;script src="js/foundation/foundation.topbar.js"&gt;&lt;/script&gt;
  
  &lt;script&gt;
    $(document).foundation();
    $(document).foundation('orbit', {
      animation: 'fade'
      timer_speed: 3000,
      pause_on_hover: false,
      resume_on_mouseout: false,
      animation_speed: 300,
  
  
    });
  
    $(".orbit-timer").hide();
    $(".orbit-slide-number").hide();
  &lt;/script&gt;
  </code></pre>
  
  <p>i have gone through other questions realated to this but could not find the right answers !</p>
  
  <p>this is the html for tooltip</p>
  
  <pre><code>&lt;span data-tooltip class="has-tip" title="Tooltips are awesome, you should totally use them!"&gt;extended information&lt;/span&gt;
  </code></pre>