search

jellekralt / Responsive-Tabs

Responsive Tabs is a jQuery plugin that provides responsive tab functionality. The tabs transform to an accordion when it reaches a CSS breakpoint. You can use this plugin as a solution for displaying tabs elegantly on desktop, tablet and mobile.
http://jellekralt.github.io/Responsive-Tabs/
MIT License
531 stars 228 forks source link

_loadElements method and find ul element logic #117

Closed galkindev closed 6 years ago

galkindev commented 7 years ago

Hi, I need to wrap ul element in div, when I am doing this responsive tabs not working. Code for example:

<div id="responsiveTabsDemo">
    <div class="wrapper">
        <ul>
            <li><a href="#tab-1"> .... </a></li>
            <li><a href="#tab-2"> .... </a></li>
            <li><a href="#tab-3"> .... </a></li>
        </ul>
    </div>

    <div id="tab-1"> ....... </div>
    <div id="tab-2"> ....... </div>
    <div id="tab-3"> ....... </div>
</div>

I investigated plugin code and cannot understand why for searching ul element used jquery children method in _loadElements method? For example in _setState method used another statement for searching ul element:

ResponsiveTabs.prototype._setState = function(e) {
        var $ul = $('ul:first', this.$element);

When I am using this statement in _loadElements method my wrapper works great, for example:

ResponsiveTabs.prototype._loadElements = function() {
        var _this = this;
        // var $ul = this.$element.children('ul:first');
        var $ul = $('ul:first', this.$element);

Why we need to find exactly ul element in children list and cannot use statement for searching ul from _setState method - $('ul:first', this.$element)? This statement for searching will find ul element within wrapper also.

What do you think about that? Thanks.

jellekralt commented 6 years ago

This should now be fixed thanks to @falconwhite in version 1.6.3