Скрыть объявление
ВАШИ ПРАВА ОГРАНИЧЕНЫ!

Зарегистрируйтесь на форуме, чтобы стать полноценным участником сообщества!

Закомментировать неактивные вкладки

Тема в разделе "Вопросы- ответы", создана пользователем exxrus, 16 окт 2015.

16.10.15 в 07:29
16.10.15 в 07:29
0
523
0
  1. TopicStarter Overlay
    exxrus

    exxrus Посетитель

    Регистрация:
    22 сен 2015
    Сообщения:
    60
    Лучших ответов:
    0
    Рейтинги:
    +16 / 0 / -0
    Вобщем сабж
    Есть вкладки вот такие:
    Код:
    <ul class="accordion-tabs">
    
        <li class="tab-head-cont">
            <a href="#" class="is-active">Трейлер</a>
            <section>
               <p>.......</p>
            </section>
        </li>
    
        <li class="tab-head-cont">
            <a href="#">Источник 1</a>
            <section>
               <p>.......</p>
            </section>
        </li>
    
        <li class="tab-head-cont">
            <a href="#">Источник 2</a>
            <section>
               <p>.......</p>
            </section>
        </li>
    
    </ul>
    
    <script>
        $(document).ready(function () {
            $('.accordion-tabs').children('li').first().children('a').addClass('is-active').next().addClass('is-open').show();
            $('.accordion-tabs').on('click', 'li > a', function(event) {
                if (!$(this).hasClass('is-active')) {
                    event.preventDefault();
                    $('.accordion-tabs .is-open').removeClass('is-open').hide();
                    $(this).next().toggleClass('is-open').toggle();
                    $('.accordion-tabs').find('.is-active').removeClass('is-active');
                    $(this).addClass('is-active');
                } else {
                    event.preventDefault();
                }
            });
        });
    </script>
    

    Необходимо что бы содержимое неактивных вкладок закомментировались вот так
    <!--
    <section>
    <p>.......</p>
    </section>
    -->

    нашел вот такую функцию на одном сайте
    Код:
    // CUSTOMIZATION
      // =============
      function commentOtherTabContainerContent (prevId, newId) {
        //
        $(prevId).html("<!--" + $(prevId).html() + "-->");
        //
        var targetHtml = $(newId).html().trim();
        if(targetHtml.indexOf('<!--') == 0) {
            var step1 = targetHtml.substring(4);
            var step2 = step1.substring(0, step1.length - 3);
            $(newId).html(step2);
        }
      }
    
    Вот отсюда этот код вырван

    Код:
    
    /* ========================================================================
     * Bootstrap: tab.js v3.0.2
     * http://getbootstrap.com/javascript/#tabs
     * ========================================================================
     * Copyright 2013 Twitter, Inc.
     *
     * Licensed under the Apache License, Version 2.0 (the "License");
     * you may not use this file except in compliance with the License.
     * You may obtain a copy of the License at
     *
     * http://www.apache.org/licenses/LICENSE-2.0
     *
     * Unless required by applicable law or agreed to in writing, software
     * distributed under the License is distributed on an "AS IS" BASIS,
     * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
     * See the License for the specific language governing permissions and
     * limitations under the License.
     * ======================================================================== */
    
    
    +function ($) { "use strict";
       $.fn.emulateTransitionEnd = function (duration) {
        var called = false, $el = this
        $(this).one($.support.transition.end, function () { called = true })
        var callback = function () { if (!called) $($el).trigger($.support.transition.end) }
        setTimeout(callback, duration)
        return this
      }
      // TAB CLASS DEFINITION
      // ====================
    
      var Tab = function (element) {
        this.element = $(element)
      }
    
      Tab.prototype.show = function () {
        var $this    = this.element
        var $ul      = $this.closest('ul:not(.dropdown-menu)')
        var selector = $this.data('target')
    
        if (!selector) {
          selector = $this.attr('href')
          selector = selector && selector.replace(/.*(?=#[^\s]*$)/, '') //strip for ie7
        }
    
        if ($this.parent('li').hasClass('active')) return
    
        var previous = $ul.find('.active:last a')[0]
        var e        = $.Event('show.bs.tab', {
          relatedTarget: previous
        })
    
        $this.trigger(e)
    
        if (e.isDefaultPrevented()) return
    
        var $target = $(selector)
        var prevTabId = $(previous).attr('href');
        this.activate($this.parent('li'), $ul, commentOtherTabContainerContent(prevTabId, selector))
        this.activate($target, $target.parent(), function () {
          $this.trigger({
            type: 'shown.bs.tab'
          , relatedTarget: previous
          })
        })
      }
    
      Tab.prototype.activate = function (element, container, callback) {
        var $active    = container.find('> .active')
        var transition = callback
          && $.support.transition
          && $active.hasClass('fade')
    
        function next() {
          $active
            .removeClass('active')
            .find('> .dropdown-menu > .active')
            .removeClass('active')
    
          element.addClass('active')
    
          if (transition) {
            element[0].offsetWidth // reflow for transition
            element.addClass('in')
          } else {
            element.removeClass('fade')
          }
    
          if (element.parent('.dropdown-menu')) {
            element.closest('li.dropdown').addClass('active')
          }
    
          callback && callback()
        }
    
        transition ?
          $active
            .one($.support.transition.end, next)
            .emulateTransitionEnd(150) :
          next()
    
        $active.removeClass('in')
      }
    
    
      // TAB PLUGIN DEFINITION
      // =====================
    
      var old = $.fn.tab
    
      $.fn.tab = function ( option ) {
        return this.each(function () {
          var $this = $(this)
          var data  = $this.data('bs.tab')
    
          if (!data) $this.data('bs.tab', (data = new Tab(this)))
          if (typeof option == 'string') data[option]()
        })
      }
    
      $.fn.tab.Constructor = Tab
    
    
      // TAB NO CONFLICT
      // ===============
    
      $.fn.tab.noConflict = function () {
        $.fn.tab = old
        return this
      }
    
    
      // TAB DATA-API
      // ============
    
      $(document).on('click.bs.tab.data-api', '[data-toggle="tab"], [data-toggle="pill"]', function (e) {
        e.preventDefault()
        $(this).tab('show')
      })
      // CUSTOMIZATION
      // =============
      function commentOtherTabContainerContent (prevId, newId) {
        //��������� ���������� �������, � ������� ������
        $(prevId).html("<!--" + $(prevId).html() + "-->");
        //��������������� (���� ����� ������������) ��, �� ������� ����
        var targetHtml = $(newId).html().trim();
        if(targetHtml.indexOf('<!--') == 0) {
            var step1 = targetHtml.substring(4);
            var step2 = step1.substring(0, step1.length - 3);
            $(newId).html(step2);
        }
      }
    }(jQuery);
    

    Можно к моему скрипту прикрутить такое же?
     
Яндекс.Метрика