Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #21 (permalink)  
Старый 22.03.2017, 09:29
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,118

Сообщение от Stay_Strong
могу взять урок по скайпу за плату
Можно тут сделать простенький пример, иллюстрирующий проблему - на нем тебе расскажут чего ты намудрил.

У тебя пока огрызки кода. Да и в них столько мешанины шо пипец!
Ответить с цитированием
  #22 (permalink)  
Старый 22.03.2017, 11:45
Профессор
Отправить личное сообщение для Rise Посмотреть профиль Найти все сообщения от Rise
 
Регистрация: 07.11.2013
Сообщений: 4,662

Stay_Strong, в чем цель отказа от jquery, если есть возможность создать кастомный билд где заменить Sizzle на querySelectorAll, и исключить не нужные модули, также есть слим билды где уже вырезаны некоторые модули, может тебе стоит наоборот полностью в праведный jquery стиль переписать плагин и попрактиковаться в создании билдов, ведь jquery есть тоже плагин на нативном JS)
Ответить с цитированием
  #23 (permalink)  
Старый 22.03.2017, 12:15
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

Скрыть элементы больше чем ...
Stay_Strong,
<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  .loadContainer{
    display: none;
  }
  .loadContainer.active{
    display:  block;
  }
  </style>
  <script>
 if (!Object.assign) {
  Object.defineProperty(Object, 'assign', {
    enumerable: false,
    configurable: true,
    writable: true,
    value: function(target, firstSource) {
      'use strict';
      if (target === undefined || target === null) {
        throw new TypeError('Cannot convert first argument to object');
      }

      var to = Object(target);
      for (var i = 1; i < arguments.length; i++) {
        var nextSource = arguments[i];
        if (nextSource === undefined || nextSource === null) {
          continue;
        }

        var keysArray = Object.keys(Object(nextSource));
        for (var nextIndex = 0, len = keysArray.length; nextIndex < len; nextIndex++) {
          var nextKey = keysArray[nextIndex];
          var desc = Object.getOwnPropertyDescriptor(nextSource, nextKey);
          if (desc !== undefined && desc.enumerable) {
            to[nextKey] = nextSource[nextKey];
          }
        }
      }
      return to;
    }
  });
}
 window.addEventListener("DOMContentLoaded", function() {

    function wrap(create, elms, all) {
        function fn(item, i) {
            var to = all || i == len - 1 ? create : create.cloneNode(true);
            item = item.parentNode.replaceChild(to, item);
            to.appendChild(item)
        }
        var len = elms.length;
        len ? [].forEach.call(elms, fn) : fn(elms)
    }
    var defaults = {
        "childrenElements": ".filter__option",
        "count": "3",
        "speed": "250",
        "textMore": "+ Показать все",
        "textLess": "- Скрыть"
    };
    window.LoadElements = function LoadElements(elements, options) {
        if (!(this instanceof LoadElements)) return new LoadElements(elements, options);
        this.options = Object.assign({}, defaults, options);
        this.elements = typeof elements === "string" ? document.querySelectorAll(elements) :
            elements.length ? elements : [elements];
        this.init()
    };
    LoadElements.prototype.init = function() {
        var self = this;
        [].forEach.call(self.elements, function(el) {
            var countChildren = el.querySelectorAll(self.options.childrenElements);
            countChildren = [].slice.call(countChildren, self.options.count);
            if (countChildren.length) {
                var container = document.createElement("div");
                container.className = "loadContainer";
                wrap(container, countChildren, true);
                var showAll = document.createElement("div");
                showAll.className = "loadMore";
                showAll.innerHTML = self.options.textMore;
                showAll.addEventListener("click", function() {
                    container.classList.toggle("active");
                    showAll.innerHTML = container.classList.contains("active") ? self.options.textLess : self.options.textMore
                });
                container.parentNode.insertBefore(showAll, container.nextSibling)
            }
        })
    };
    LoadElements(".filter__item")
});
  </script>
</head>

<body>
<div class="filter__wrapper">
<form action="" class="filter">
<div class="filter__item">
          <div class="filter__name">Производители</div>
          <div class="filter__option--wrapper">
            <div class="filter__option">
              <input id="check1" type="checkbox"/>
              <label for="check1">ACV</label>
            </div>
            <div class="filter__option">
              <input id="check2" type="checkbox"/>
              <label for="check2">AE&T</label>
            </div>
            <div class="filter__option">
              <input id="check3" type="checkbox"/>
              <label for="check3">Ariston</label>
            </div>
            <div class="filter__option">
              <input id="check4" type="checkbox"/>
              <label for="check4">Armada</label>
            </div>
            <div class="filter__option">
              <input id="check5" type="checkbox"/>
              <label for="check5">Baxi</label>
            </div>
            <div class="filter__option">
              <input id="check6" type="checkbox"/>
              <label for="check6">Buderus</label>
            </div>
            <div class="filter__option">
              <input id="check7" type="checkbox"/>
              <label for="check7">Chaffoteaux</label>
            </div>
            <div class="filter__option">
              <input id="check8" type="checkbox"/>
              <label for="check8">Matrix</label>
            </div>
            <div class="filter__option">
              <input id="check9" type="checkbox"/>
              <label for="check9">MATRIX</label>
            </div>
          </div>
        </div>
 <div class="filter__item">
          <div class="filter__name">Производители</div>
          <div class="filter__option--wrapper">
            <div class="filter__option">
              <input id="check1" type="checkbox"/>
              <label for="check1">ACV</label>
            </div>
            <div class="filter__option">
              <input id="check2" type="checkbox"/>
              <label for="check2">AE&T</label>
            </div>
            <div class="filter__option">
              <input id="check3" type="checkbox"/>
              <label for="check3">Ariston</label>
            </div>
            <div class="filter__option">
              <input id="check4" type="checkbox"/>
              <label for="check4">Armada</label>
            </div>
            <div class="filter__option">
              <input id="check5" type="checkbox"/>
              <label for="check5">Baxi</label>
            </div>
            <div class="filter__option">
              <input id="check6" type="checkbox"/>
              <label for="check6">Buderus</label>
            </div>
            <div class="filter__option">
              <input id="check7" type="checkbox"/>
              <label for="check7">Chaffoteaux</label>
            </div>
            <div class="filter__option">
              <input id="check8" type="checkbox"/>
              <label for="check8">Matrix</label>
            </div>
            <div class="filter__option">
              <input id="check9" type="checkbox"/>
              <label for="check9">MATRIX</label>
            </div>
          </div>
        </div>
</form>
</div>


</body>
</html>

Последний раз редактировалось рони, 22.03.2017 в 12:18.
Ответить с цитированием
  #24 (permalink)  
Старый 29.03.2017, 18:13
Аватар для Stay_Strong
Аспирант
Отправить личное сообщение для Stay_Strong Посмотреть профиль Найти все сообщения от Stay_Strong
 
Регистрация: 14.10.2015
Сообщений: 37

рони,
Вот вы мне тут накатали, спасибо огромное, конечно. Теперь мне тут со всем разобраться нужно, потому что это совсем стиль, не тот, в котором я писал и пишу. Вы уроки не даете по скайпу?

P.S.: Здесь совсем все по-взрослому, без комментариев не разберусь.

Последний раз редактировалось Stay_Strong, 29.03.2017 в 18:18.
Ответить с цитированием
  #25 (permalink)  
Старый 29.03.2017, 18:24
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,064

Stay_Strong,
попробуйте разобраться самостоятельно ...
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Auto resizing textarea на чистом JavaScript volshebnyi jQuery 1 16.09.2016 10:34
аналог ajaxupload на чистом js Гугл-мен Общие вопросы Javascript 1 04.11.2013 13:49
Есть ли в JavaScript аналог функции exec() из php? lorddarkside Общие вопросы Javascript 3 22.12.2010 12:37
Последние книги по JavaScript! monolithed Учебные материалы 7 26.10.2010 19:40
Выдвет ошибку JavaScript Ромио Opera, Safari и др. 4 21.10.2010 20:34