Menu icon Foundation
Orbit not formatted

Hello All,   

 

I am having trouble setting up an orbit.    

All CSS and JS is loading but can get the example to work and I have tried to change the classes to fit the ones in the foundation.css file but nothing works.   

   

Below is a screen shot, let me know if more data is needed.   

 

<!-- CSS and Fonts -->
		<link rel="stylesheet" type="text/css" href="<?php echo base_url(); ?>assets/foundation-6.4.2/css/foundation.css">
<ul class="orbit-content" data-orbit>
  <li data-orbit-slide="headline-1">
    <div>
      <h2>Headline 1</h2>
      <h3>Subheadline</h3>
    </div>
  </li>
  <li data-orbit-slide="headline-2">
    <div>
      <h2>Headline 2</h2>
      <h3>Subheadline</h3>
    </div>
  </li>
  <li data-orbit-slide="headline-3">
    <div>
      <h2>Headline 3</h2>
      <h3>Subheadline</h3>
    </div>
  </li>
</ul>
<!-- load foundation Jquery and Javascript -->
		<script src="<?php echo base_url(); ?>assets/foundation-6.4.2/js/vendor/jquery.js"></script>
		<script src="<?php echo base_url(); ?>assets/foundation-6.4.2/js/vendor/foundation.js"></script>
		<script src="<?php echo base_url(); ?>assets/foundation-6.4.2/js/vendor/what-input.js"></script>
		<script src="<?php echo base_url(); ?>assets/foundation-6.4.2/js/app.js"></script>
		<!-- End load foundation Jquery and Javascript -->

 

 

Orbit

Hello All,   

 

I am having trouble setting up an orbit.    

All CSS and JS is loading but can get the example to work and I have tried to change the classes to fit the ones in the foundation.css file but nothing works.   

   

Below is a screen shot, let me know if more data is needed.   

 

<!-- CSS and Fonts -->
		<link rel="stylesheet" type="text/css" href="<?php echo base_url(); ?>assets/foundation-6.4.2/css/foundation.css">
<ul class="orbit-content" data-orbit>
  <li data-orbit-slide="headline-1">
    <div>
      <h2>Headline 1</h2>
      <h3>Subheadline</h3>
    </div>
  </li>
  <li data-orbit-slide="headline-2">
    <div>
      <h2>Headline 2</h2>
      <h3>Subheadline</h3>
    </div>
  </li>
  <li data-orbit-slide="headline-3">
    <div>
      <h2>Headline 3</h2>
      <h3>Subheadline</h3>
    </div>
  </li>
</ul>
<!-- load foundation Jquery and Javascript -->
		<script src="<?php echo base_url(); ?>assets/foundation-6.4.2/js/vendor/jquery.js"></script>
		<script src="<?php echo base_url(); ?>assets/foundation-6.4.2/js/vendor/foundation.js"></script>
		<script src="<?php echo base_url(); ?>assets/foundation-6.4.2/js/vendor/what-input.js"></script>
		<script src="<?php echo base_url(); ?>assets/foundation-6.4.2/js/app.js"></script>
		<!-- End load foundation Jquery and Javascript -->

 

 

This post has been closed. No new replies can be added.

Thomas Cummings over 1 year ago

Got this working, was looking at the wrong documents.