Reply To: Set tab default

[Robert Kavgić]

Hello,

Open up js/include.js and replace your existing function for displaying tabs:

// CONTENT TABS
    (function () {
        $('.tabs').each(function () {
            var $tabLis = $(this).find('li');
            var $tabContent = $(this).next('.tab-content-wrap').find('.tab-content');

            $tabContent.hide();
            $tabLis.first().addClass('active').show();
            $tabContent.first().show();
        });

        $('.tabs').on('click', 'li', function (e) {
            var $this = $(this);
            var parentUL = $this.parent();
            var tabContent = parentUL.next('.tab-content-wrap');

            parentUL.children().removeClass('active');
            $this.addClass('active');

            tabContent.find('.tab-content').hide();
            var showById = $($this.find('a').attr('href'));
            tabContent.find(showById).fadeIn();

            e.preventDefault();
        });
    })();

With the following function:

// CONTENT TABS
(function () {
	$('.tabs').each(function () {
		var $tabLis = $(this).find('li.active');
		var $tabContent = $(this).next('.tab-content-wrap').find('.tab-content');

		$tabContent.hide();
		$tabLis.first().addClass('active').show();
		$tabContent.first().show();
	});

	$('.tabs').on('click', 'li', function (e) {
		var $this = $(this);
		var parentUL = $this.parent();
		var tabContent = parentUL.next('.tab-content-wrap');

		parentUL.children().removeClass('active');
		$this.addClass('active');

		tabContent.find('.tab-content').hide();
		var showById = $this.find('a').attr('href');
		var activeChild = $(showById).find('li.active a').attr('href');
		$(showById).find(activeChild).show();
		tabContent.find(showById).fadeIn();

		e.preventDefault();
	});
})();

Now the <li> element with class="active" will only be displayed.

Robert