Menu icon Foundation

My Posts


My Comments

Terry Barth commented on Terry Barth's post over 5 years

Well that little bit of code is embarrassing. I have corrected that.

As for my site not loading, very odd. I didn't realize that was happening. It loads for me in FF. Now I realize it's not loading in IE or Chrome. it just shows 2014.

I'll have to reconfigure how I set this up.

I'll be back. Thanks for hanging in there with me.

Terry

Terry Barth commented on Terry Barth's post over 5 years

Sorry about that. I thought links to the pages would suffice. Thanks for taking a look.

Medium HTML

Note: the code for the individual slides are generated by a script in my CMS. This reflects the generated code on the page after the cms displays the page.

<!doctype html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>interchange</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"></script>
<link rel="stylesheet" type="text/css" href="assets/css/cycle-style.css" media="all" />
</head>
<body>
<style>.cycle-slide {max-width: 375px;}
</style>
  <div id="main">
  <p>Doc Id: 13 Templage: 18</p>
  <hr />

<div class="cycle-slideshow clearfix"
  data-cycle-fx=scrollHorz
  data-cycle-timeout=4000
  data-cycle-slides="> div"
>
    <div class="slide">
      <img src="assets/images/test-images/slide-03.jpg" data-cycle-title="" data-cycle-desc="">
      <div class="captions">
        <div class="line1"></div>
        <div><span></span> 
        </div>
      </div><!--captions-->
    </div id="slide">
    <div class="slide">
      <img src="assets/images/test-images/slide-04.jpg" data-cycle-title="" data-cycle-desc="">
      <div class="captions">
        <div class="line1"></div>
        <div><span></span> 
        </div>
      </div><!--captions-->
    </div id="slide">
    <div class="slide">
      <img src="assets/images/test-images/slide-07.jpg" data-cycle-title="" data-cycle-desc="">
      <div class="captions">
        <div class="line1"></div>
        <div><span></span> 
        </div>
      </div><!--captions-->
    </div id="slide">
    <div class="slide">
      <img src="assets/images/test-images/slide-08.jpg" data-cycle-title="" data-cycle-desc="">
      <div class="captions">
        <div class="line1"></div>
        <div><span></span> 
        </div>
      </div><!--captions-->
    </div id="slide">
</div><!--cycle-slideshow-->
  </div> <!-- #main -->
<script src="http://malsup.github.com/jquery.cycle2.js"></script>
</body>
</html>

The page with interchange.

<!doctype html>
<html class="no-js" lang="en">
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Foundation 5's Interchange Demos  | Welcome</title>
    <link rel="stylesheet" href="assets/foundation/css/foundation.css" />
<!--  <link rel="stylesheet" type="text/css" href="assets/css/carousel-style---.css" media="all" />
  <link rel="stylesheet" type="text/css" href="assets/css/cycle-style.css" media="all" />-->
  </head>
  <body>
    <div class="row">
      <div class="large-12 columns">
        <h1>Foundation 5's Interchange Demos</h1>
      </div>
    </div>
    <hr>
    <div class="row">
      <div class="large-12 columns">

  <div id="swap" data-interchange="[http://c0999.paas2.tx.modxcloud.com/index.php?id=12, (small)], [http://c0999.paas2.tx.modxcloud.com/index.php?id=13, (medium)],[assets/foundation/maps/large--.html, (large)]">
        <div data-alert class="alert-box secondary radius">
    This is the default content.
    <a href="#" class="close">&times;</a>
  </div>
      </div>

<!--
    <hr>

    <h3>Interchange for Images Example</h3>
    <img data-interchange="[assets/foundation/img/space-small.jpg, (small)], [assets/foundation/img/space-medium.jpg, (medium)], [assets/foundation/img/space-large.jpg, (large)]">
-->
      </div>
    </div>

<script src="assets/foundation/js/modernizr.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"></script>
<script src="assets/foundation/js/foundation.min.js"></script>

<script src="assets/js/jquery.cycle2.min.js"></script>

<!--    <script>
      $(document).foundation();
    </script>  -->

<script>
      $(document).foundation();
      $("#swap").on("replace", function() {
$(document).foundation();
});
    </script>
  </body>
</html>

Posts Followed

No Content

Following

    No Content

Followers

My Posts

My Comments

You commented on Terry Barth's post over 5 years

Well that little bit of code is embarrassing. I have corrected that.

As for my site not loading, very odd. I didn't realize that was happening. It loads for me in FF. Now I realize it's not loading in IE or Chrome. it just shows 2014.

I'll have to reconfigure how I set this up.

I'll be back. Thanks for hanging in there with me.

Terry

You commented on Terry Barth's post over 5 years

Sorry about that. I thought links to the pages would suffice. Thanks for taking a look.

Medium HTML

Note: the code for the individual slides are generated by a script in my CMS. This reflects the generated code on the page after the cms displays the page.

<!doctype html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>interchange</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"></script>
<link rel="stylesheet" type="text/css" href="assets/css/cycle-style.css" media="all" />
</head>
<body>
<style>.cycle-slide {max-width: 375px;}
</style>
  <div id="main">
  <p>Doc Id: 13 Templage: 18</p>
  <hr />

<div class="cycle-slideshow clearfix"
  data-cycle-fx=scrollHorz
  data-cycle-timeout=4000
  data-cycle-slides="> div"
>
    <div class="slide">
      <img src="assets/images/test-images/slide-03.jpg" data-cycle-title="" data-cycle-desc="">
      <div class="captions">
        <div class="line1"></div>
        <div><span></span> 
        </div>
      </div><!--captions-->
    </div id="slide">
    <div class="slide">
      <img src="assets/images/test-images/slide-04.jpg" data-cycle-title="" data-cycle-desc="">
      <div class="captions">
        <div class="line1"></div>
        <div><span></span> 
        </div>
      </div><!--captions-->
    </div id="slide">
    <div class="slide">
      <img src="assets/images/test-images/slide-07.jpg" data-cycle-title="" data-cycle-desc="">
      <div class="captions">
        <div class="line1"></div>
        <div><span></span> 
        </div>
      </div><!--captions-->
    </div id="slide">
    <div class="slide">
      <img src="assets/images/test-images/slide-08.jpg" data-cycle-title="" data-cycle-desc="">
      <div class="captions">
        <div class="line1"></div>
        <div><span></span> 
        </div>
      </div><!--captions-->
    </div id="slide">
</div><!--cycle-slideshow-->
  </div> <!-- #main -->
<script src="http://malsup.github.com/jquery.cycle2.js"></script>
</body>
</html>

The page with interchange.

<!doctype html>
<html class="no-js" lang="en">
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Foundation 5's Interchange Demos  | Welcome</title>
    <link rel="stylesheet" href="assets/foundation/css/foundation.css" />
<!--  <link rel="stylesheet" type="text/css" href="assets/css/carousel-style---.css" media="all" />
  <link rel="stylesheet" type="text/css" href="assets/css/cycle-style.css" media="all" />-->
  </head>
  <body>
    <div class="row">
      <div class="large-12 columns">
        <h1>Foundation 5's Interchange Demos</h1>
      </div>
    </div>
    <hr>
    <div class="row">
      <div class="large-12 columns">

  <div id="swap" data-interchange="[http://c0999.paas2.tx.modxcloud.com/index.php?id=12, (small)], [http://c0999.paas2.tx.modxcloud.com/index.php?id=13, (medium)],[assets/foundation/maps/large--.html, (large)]">
        <div data-alert class="alert-box secondary radius">
    This is the default content.
    <a href="#" class="close">&times;</a>
  </div>
      </div>

<!--
    <hr>

    <h3>Interchange for Images Example</h3>
    <img data-interchange="[assets/foundation/img/space-small.jpg, (small)], [assets/foundation/img/space-medium.jpg, (medium)], [assets/foundation/img/space-large.jpg, (large)]">
-->
      </div>
    </div>

<script src="assets/foundation/js/modernizr.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"></script>
<script src="assets/foundation/js/foundation.min.js"></script>

<script src="assets/js/jquery.cycle2.min.js"></script>

<!--    <script>
      $(document).foundation();
    </script>  -->

<script>
      $(document).foundation();
      $("#swap").on("replace", function() {
$(document).foundation();
});
    </script>
  </body>
</html>

Posts Followed

No Content

Following

  • No Content

Followers

  • No Content