Показать сообщение отдельно
  #8 (permalink)  
Старый 13.04.2019, 14:20
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,072

maxthecreator,
уберите hide и show сделайте class
<!DOCTYPE html>

<html>
<head>
    <title>Untitled</title>
    <meta charset="utf-8">
    <style type="text/css">
       .active{
           background-color: #F0E68C;
       }
      .products.active{
          display: flex;
      }
      .products{
          display: none;
       }

    </style>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

    <script>
(function($){
    jQuery.fn.lightTabs = function(options){
        var createTabs = function(){
        var tabs = this,
        showPage = function(i){
                blocks.removeClass("active")
                .eq(i).addClass("active");
                li.removeClass("active")
                .eq(i).addClass("active");
            },
        li = $(">ul li", tabs).each(function(index, element){$(element).click(showPage.bind(null,index))}) ,
        blocks = $(">.products", tabs);
        showPage(0);
        };
        return this.each(createTabs);
    };
})(jQuery);
$(document).ready(function(){
    $(".products__content").lightTabs();
});

    </script>
</head>

<body>
<div class="products__content">
<!--<div class="products-type">-->
    <ul class="products-type__list">
        <li class="products-type__list-item">
        <!--<a href="" class="products-type__list-link">Бетон</a>-->
        Бетон
            </li>
        <li class="products-type__list-item">
    <!--<a href="" class="products-type__list-ink">Растворы</a>-->										Растворы
        </li>
</ul>
<!--</div>-->
                            <!-- Бетон -->
                            <div class="products main-page__products-list products-carousel">
                                <div class="card card_hover product-card main-page__product-card">
                                    <div class="product-title">
                                        <p class="product-name">Бетон</p>
                                        <p class="product-code">
                                            <span class="product-code_bold">М300</span> (B&#8209;20)
                                        </p>
                                    </div>
                                    <p class="product-card__text">Несущие стены, плиты перекрытий, балки, колонны, фундаменты</p>
                                    <div class="product-card__price-wrapper">
                                        <p class="price product-card__price">От<br><span class="price__value">2750</span> руб./&nbsp;м3</p>
                                    </div>
                                    <div class="product-card__enter">
                                        <a href="product.html">
                                            <img src="images/icons/jump.svg" alt="">
                                        </a>
                                    </div>
                                </div>
            </div>
                            <!-- Растворы -->
                            <div class="products main-page__products-list owl-carousel products-carousel" >
                                <div class="card card_hover product-card main-page__product-card">
                                    <div class="product-title">
                                        <p class="product-name">Раствор</p>
                                        <p class="product-code">
                                            <span class="product-code_bold">М300</span> (B&#8209;20)
                                        </p>
                                    </div>
                                    <p class="product-card__text">cxszcxНесущие стены, плиты перекрытий, балки, колонны, фундаменты</p>
                                    <div class="product-card__price-wrapper">
                                        <p class="price product-card__price">От<br><span class="price__value">2750</span> руб./&nbsp;м3</p>
                                    </div>
                                    <div class="product-card__enter">
                                        <a href="product.html">
                                            <img src="images/icons/jump.svg" alt="">
                                        </a>
                                    </div>
                                </div>

                            </div>
                            <a href="catalog.html" class="btn btn_dark products__btn">Смотреть каталог</a>
                            <div class="slider-arrows products__slider-arrows">
                                <div class="slider-btn slider-btn_prev"></div>
                                <div class="slider-btn slider-btn_next"></div>
                            </div>
                        </div>

</body>
</html>
Ответить с цитированием