Sticky '_calc' is not an available method for this element

I'm trying to invoke the recalculation of the sticky header when using Foundation 6. However everything i attempt returns

We're sorry, '_calc' is not an available method for this element

Here's the declaration of the sticky element:

<div id="sticky-container" data-sticky-container>
    <div id="sticky" data-sticky data-margin-top="0" data-top-anchor="the-table" 
                     data-btm-anchor="footer:bottom" style="width: 100%">

I've tried:

$('.sticky:visible').foundation('_calc', true);
$('#sticky-container').foundation('_calc', true);
$('#sticky').foundation('_calc', true);

All 3 of these usages returns the _calc is not available.

Answers:

Answer

I think the problem is that you're not calling $(document).foundation(); directly before the call to .foundation with _calc. In my tests, I've been able to replicate the error if I call $('#sticky').foundation('_calc', true); before $(document).foundation(); is called. The issue stems from the fact that the sticky element hasn't been initialized when you're calling $('#sticky').foundation('_calc', true);

  1. Fiddle where $(document).foundation(); is called before.

  2. Fiddle where $(document).foundation(); is called after.

I'm pretty sure the above is the cause. If not, please let me know.

Tags

Recent Questions

Top Questions

Home Tags Terms of Service Privacy Policy DMCA Contact Us

©2020 All rights reserved.