Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p><strong>EDIT: THE FOUNDATION DOUMENTATION CONTAINS</strong></p> <pre><code>&lt;ul data-orbit="" class="orbit-slides-container"&gt; </code></pre> <p><strong>REMOVE: ="" class="orbit-slides-container" It did the TRICK FOR ME: SO it becomes:</strong></p> <pre><code>&lt;ul data-orbit&gt; </code></pre> <hr> <p>"Uncaught TypeError: Object # this is because jQuery has not loaded. Download jQuery from here <a href="http://jquery.com/download/" rel="nofollow">http://jquery.com/download/</a></p> <p>Link this jQuery file to your website</p> <p>Even if the jQuery file is linked properly make sure it is loaded in the </p> <p><code>&lt;head&gt;&lt;/head&gt;</code> tags before loading the foundation javascript files</p> <pre><code>&lt;head&gt; &lt;meta charset="utf-8" /&gt; &lt;meta name="viewport" content="width=device-width" /&gt; &lt;title&gt; Foundation 4&lt;/title&gt; &lt;!-- If you are using CSS version, only link these 2 files, you may add app.css to use for your overrides if you like. --&gt; &lt;link rel="stylesheet" href="foundation-4/css/normalize.css" /&gt; &lt;link rel="stylesheet" href="foundation-4/css/foundation.css" /&gt; &lt;script src="LINKTO JQUERY JS FILE"&gt;&lt;/script&gt; &lt;script src="foundation-4/js/vendor/custom.modernizr.js"&gt;&lt;/script&gt; &lt;/head&gt; </code></pre> <p><strong>EDIT:</strong></p> <pre><code>&lt;div class="row"&gt; &lt;div class="orbit-container"&gt; &lt;ul data-orbit="" class="orbit-slides-container"&gt; &lt;li&gt; &lt;img src="3.jpg"&gt; &lt;div class="orbit-caption"&gt;IMAGE 3&lt;/div&gt; &lt;/li&gt; &lt;li class="active"&gt; &lt;img src="1.jpg"&gt; &lt;div class="orbit-caption"&gt;IMAGE 1&lt;/div&gt; &lt;/li&gt; &lt;li&gt; &lt;img src="2.jpg"&gt; &lt;div class="orbit-caption"&gt;IMAGE 2&lt;/div&gt; &lt;/li&gt; &lt;li&gt; &lt;img src="3.jpg"&gt; &lt;div class="orbit-caption"&gt;IMAGE 3&lt;/div&gt; &lt;/li&gt; &lt;li&gt; &lt;img src="1.jpg"&gt; &lt;div class="orbit-caption"&gt;IMAGE 1&lt;/div&gt; &lt;/li&gt; &lt;/ul&gt; &lt;/div&gt; &lt;/div&gt; </code></pre> <p><strong>EDIT: TRY THIS</strong></p> <pre><code> &lt;div class="large-12 columns"&gt; &lt;div class="orbit-container"&gt; &lt;ul data-orbit&gt; &lt;li data-orbit-slide="headline-1"&gt; &lt;h2&gt;Headline 1&lt;/h2&gt; &lt;h3&gt;Subheadline&lt;/h3&gt; &lt;p&gt;Pellentesque habitant morbi tristique senectus.&lt;/p&gt; &lt;/li&gt; &lt;li data-orbit-slide="headline-2"&gt; &lt;h2&gt;Headline 2&lt;/h2&gt; &lt;h3&gt;Subheadline&lt;/h3&gt; &lt;p&gt;Pellentesque habitant morbi tristique senectus.&lt;/p&gt; &lt;/li&gt; &lt;/ul&gt; &lt;/div&gt; &lt;/div&gt; </code></pre>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. VO
      singulars
      1. This table or related slice is empty.
    2. VO
      singulars
      1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload