Cannot call method of 'start' undefined.

[JackWReid]

I have this markup on the page, and both the slidr library and object call comes in just at the end of the body. The implementation works flawlessly on Chrome on OS X even though the console spits this message:

Uncaught TypeError: Cannot call method 'start' of undefined 

However, Chrome on Windows doesn't render slidr at all, instead leaving a 0 height object.

The Body

<div id="featured" class="center">
    <div data-slidr="one">
        <h2><a href="http://pearshapedexeter.com/post/77702772634/skaters-manhattan-review">Skaters - 'Manhattan' Review</a></h2>
        <img src="http://i.imgur.com/Q6ad10V.jpg" alt="Manhattan - Skaters">
        <p><b>Pip Williams</b> reviews the new release from up and coming group Skaters.</p>
    </div>
    <div data-slidr="two">
        <h2><a href="http://pearshapedexeter.com/post/77701630818/post-four-monday-24th-february-2014-hello-fond">The Listening Post - #4</a></h2>
        <img src="http://i.imgur.com/RG6yUlv.jpg" alt="The Listening Post">
        <p><b>James Hitchings-Hales</b> flags the best in new music for your perusal.</p>
    </div>
    <div data-slidr="three">
        <h2><a href="http://pearshapedexeter.com/post/77700202322/thumpers-headline-kink-nights-at-the-cavern">Thumpers Headline KINK</a></h2>
        <img src="http://i.imgur.com/gmIGaaR.jpg" alt="Thumpers at Cavern">
        <p><b>Jack Reid</b> gives his take on the appearance of the formidable Thumpers at Cavern.</p>
    </div>
</div>

The Call

// Slider
        slidr.create('featured', {
          breadcrumbs: true,
          controls: 'border',
          keyboard: true,
          theme: '#498c34',
          touch: true,
          transition: 'cube'
        }).start();

[JackWReid]

Discovered that upon forcing the height of the element with the id hook, the content within is visible on Chrome on Windows also.

[bchanx]

Hey @JackWReid,

Does that fix the issue entirely, or are you still experiencing the console errors?
If there's still an error, could you hook up an example to jsfiddle, or provide me with the CSS you're using so I can take a look?

[bchanx]

Hey @JackWReid,

I browsed your site a bit and noticed the console error:

[Slidr] Could not find element with id [listings]. app.js:84
Uncaught TypeError: Cannot call method 'start' of undefined

Seems like you're calling slidr.create('listings') somewhere, but don't actually have an <element id="listings"></element> anywhere in your markup - hence the failure to start(). Does that solve the issue?

[JackWReid]

I've cut that call out of the code (it was in preparation of another implementation elsewhere on the site), and it has cleared the console errors. However, the problem persists that Windows Chrome is failing to detect the height of the child elements in the slidr and so collapses #featured down to 0px. So in the meantime, I've lumped it with a really awkward static height.

Issue isn't reproduced on this jsfiddle which makes me think the bug is being produced by Tumblr's injections (site runs on Tumblr as a jank CMS).