Menu icon Foundation

My Posts



  • 2
    Replies
  • Tooltips not working (v4)

    By Glenn Ford

    tooltips

    I have foundation css, js in. I have modernizr js in head. I have foundation tooltips js after foundation js. Yet I still have no tooltips. I am not sure how to debug this, chrome debug console has no errors. Any help is appreciate. TIA

    Last Reply by Glenn Ford almost 6 years ago


My Comments

Glenn Ford commented on Glenn Ford's post almost 6 years

FYI I do call reflow after the ellipsis function is called you can see this in the working code example I provided at http://imarketing-hq.com/zurb/

Glenn Ford commented on Glenn Ford's post almost 6 years

I added this piece of static HTML code and it works fine. So the problem is when I use javascript to modify the html it is broken.
HTML
<a href="#" data-reveal-id="limits-modal">test</a>

In my openi.js file I do this in a function called ellipsis. This function is used in conjunction with a redraw on browser resize to "clip" the limits line with the ellipsis.

For some reason zurb break when write out the html with javascript.

Glenn Ford commented on Glenn Ford's post almost 6 years

I forgot to mention on there click the ellipsis in the top right.

Glenn Ford commented on Glenn Ford's post almost 6 years

I was getting really frustrated with this so moved the test code to a server that can be seen by all of you.

Please look at this URL and any help on why the reveal is broken here and not in version 4 is very welcomed.

http://imarketing-hq.com/zurb/

Glenn Ford commented on Glenn Ford's post almost 6 years

Hi Rafi,

Here is how I include the scripts at the end.

 <script src="js/vendor/jquery.js"></script>

  <script src="js/foundation/foundation.js"></script>

  <script src="js/foundation/foundation.clearing.js"></script>

  <script src="js/foundation/foundation.dropdown.js"></script>

  <script src="js/foundation/foundation.joyride.js"></script>

  <script src="js/foundation/foundation.magellan.js"></script>

  <script src="js/foundation/foundation.orbit.js"></script>

  <script src="js/foundation/foundation.reveal.js"></script>

  <script src="js/foundation/foundation.topbar.js"></script>

  <script src="js/foundation/foundation.interchange.js"></script>

  <script src="js/foundation/foundation.abide.js"></script>

  <script defer src="js/plugins.js"></script>
  <script defer src="js/script.js"></script>
  <script src="js/openi.js"></script>
  <script>
      $(document).foundation({reveal: {animation: 'fade', animationSpeed : 50, close_on_background_click: false}});
  </script>
</body>

Glenn Ford commented on Glenn Ford's post almost 6 years

Yes I have, mine is slightly difference because of the way i initialize.

      $(document).foundation('reveal', {animation: 'fade', animationSpeed : 50, close_on_background_click: false});

I am quite at a loss. I have obviously added some code (css or js) that clobbers foundation but backtracking the amount of code out I have is daunting.

Glenn Ford commented on Rafi Benkual's post almost 6 years

Sorry there's no edit button, but I wanted to add another resource I had in my bookmarks: http://www.techbits.de/2011/10/25/building-a-google-plus-inspired-image-gallery/

I ended up using this. Works great! Thanks!

Glenn Ford commented on Rafi Benkual's post about 6 years

I found Isotope http://isotope.metafizzy.co/ and Masrony http://masonry.desandro.com/ .

I was interested in doing more a css version. Not sure how possible.

Posts Followed

  • 2
    Replies
  • Tooltips not working (v4)

    By Glenn Ford

    tooltips

    I have foundation css, js in. I have modernizr js in head. I have foundation tooltips js after foundation js. Yet I still have no tooltips. I am not sure how to debug this, chrome debug console has no errors. Any help is appreciate. TIA

    Last Reply by Glenn Ford almost 6 years ago


Following

    No Content

Followers

My Posts



My Comments

You commented on Glenn Ford's post almost 6 years

FYI I do call reflow after the ellipsis function is called you can see this in the working code example I provided at http://imarketing-hq.com/zurb/

You commented on Glenn Ford's post almost 6 years

I added this piece of static HTML code and it works fine. So the problem is when I use javascript to modify the html it is broken.
HTML
<a href="#" data-reveal-id="limits-modal">test</a>

In my openi.js file I do this in a function called ellipsis. This function is used in conjunction with a redraw on browser resize to "clip" the limits line with the ellipsis.

For some reason zurb break when write out the html with javascript.

You commented on Glenn Ford's post almost 6 years

I forgot to mention on there click the ellipsis in the top right.

You commented on Glenn Ford's post almost 6 years

I was getting really frustrated with this so moved the test code to a server that can be seen by all of you.

Please look at this URL and any help on why the reveal is broken here and not in version 4 is very welcomed.

http://imarketing-hq.com/zurb/

You commented on Glenn Ford's post almost 6 years

Hi Rafi,

Here is how I include the scripts at the end.

 <script src="js/vendor/jquery.js"></script>

  <script src="js/foundation/foundation.js"></script>

  <script src="js/foundation/foundation.clearing.js"></script>

  <script src="js/foundation/foundation.dropdown.js"></script>

  <script src="js/foundation/foundation.joyride.js"></script>

  <script src="js/foundation/foundation.magellan.js"></script>

  <script src="js/foundation/foundation.orbit.js"></script>

  <script src="js/foundation/foundation.reveal.js"></script>

  <script src="js/foundation/foundation.topbar.js"></script>

  <script src="js/foundation/foundation.interchange.js"></script>

  <script src="js/foundation/foundation.abide.js"></script>

  <script defer src="js/plugins.js"></script>
  <script defer src="js/script.js"></script>
  <script src="js/openi.js"></script>
  <script>
      $(document).foundation({reveal: {animation: 'fade', animationSpeed : 50, close_on_background_click: false}});
  </script>
</body>

You commented on Glenn Ford's post almost 6 years

Yes I have, mine is slightly difference because of the way i initialize.

      $(document).foundation('reveal', {animation: 'fade', animationSpeed : 50, close_on_background_click: false});

I am quite at a loss. I have obviously added some code (css or js) that clobbers foundation but backtracking the amount of code out I have is daunting.

You commented on Rafi Benkual's post almost 6 years

Sorry there's no edit button, but I wanted to add another resource I had in my bookmarks: http://www.techbits.de/2011/10/25/building-a-google-plus-inspired-image-gallery/

I ended up using this. Works great! Thanks!

You commented on Rafi Benkual's post about 6 years

I found Isotope http://isotope.metafizzy.co/ and Masrony http://masonry.desandro.com/ .

I was interested in doing more a css version. Not sure how possible.

Posts Followed


Following

  • No Content

Followers

  • No Content