Jump to content

Sigizmund

User
  • Posts

    30
  • Joined

  • Last visited

  • Days Won

    1

Posts posted by Sigizmund

  1. 1 час назад, Tilonorrinco сказал:

    Прикольная задача мне попадалась на просторах интернета:

    Что нужно сделать, чтобы при вызове [1,2,3,4].duplicate() возвращался измененный продублированный исходный массив?

    Т.е. должно работать вот так:

    
    var arr = [1,2,3,4,5];
    arr.duplicate();
    console.log(arr) //-> [1,2,3,4,5,1,2,3,4,5]

    А вообще, есть сайты типа codewars.com / codefights.com -- там есть и задачи, и тесты, и различные варианты выполнения. По-моему, это самый подходящий вариант.

    Метода duplicate у массивов нет, т.е. предлагается прописать его в Array.prototype, а это антипаттерн.

  2. 1 час назад, DivMan сказал:

    Дан текст, положить каждую букву в span

    
    <div class='span'>Какой-то текст</div>
    
    <script>
    var div = document.querySelector('.span')
    var arr = [];
    var res = [];
    var fin = []
    
    arr = div.innerHTML.split('')
    for(var i = 0; i< arr.length; i++){
    	res = res  + '<span>'+  arr[i] +  '</span>' + ','
    }
    
    fin = res.split(',').join('')
    
    div.innerHTML = fin
    console.log(fin)
    </script>

     

    const element = document.querySelector(".span");
    const lettersArr = element.textContent.split("");
    const spansArr = lettersArr.map(letter => {
    	let span = document.createElement("span");
    	span.textContent = letter;
    	return span;
    });
    element.textContent = "";
    spansArr.map(span => {
    	return element.appendChild(span);
    });

    или

    const element = document.querySelector(".span");
    const lettersArr = element.textContent.split("");
    const spansArr = lettersArr.map(letter => {
    	return `<span>${letter}</span>`;
    });
    
    element.innerHTML = spansArr.join("");

     

  3. Update: Нашёл ещё один вариант для пользователей Windows 10. При включении подсистемы Linux( Ubuntu ) в Windows 10 становится доступной линуксовская консоль со всеми её командами. Инструкция на Хабре Читаем комментарии, у кого русская Винда, и он не может найти нужные разделы в панели управления.
    После установки открываем cmd.exe на родительской папке( левый Shift + ПКМ на папке -> Открыть окно PowerShell здесь ), вводим bash, появляется консоль Ubuntu, в ней вводим rm -rf папка-для-удаления Усё, папка удалена. Пример команды: rm -rf node_modules

  4. 14 минуты назад, npofopr сказал:

    Вы windows XP что ли пользуетесь? 

    А ещё можно nodejs обновить :-) 

    Да нет, у меня 10-ка, в ней эта проблема тоже есть. Node.js нужно установить актуальную версию с оффсайта https://nodejs.org/en/download/

    4 минуты назад, wwt сказал:

    1. Используем ОС  *nix/Linux/*BSD

    2. PROFIT

    Пост именно для пользователей Windows, не все готовы с привычной системой расстаться.

  5. Многие сталкиваются с проблемой невозможности удаления файлов и папок со слишком длинным путём до них в файловой системе на базе Windows. Если путь слишком длинный( больше 256 символов ), при попытке удаления файла или папки, Windows выдаёт ошибку «Файловая система не поддерживает такие длинные имена исходных файлов», это не исправлено даже в 10-й версии операционной системы. Если поискать ответ в Интернете, наиболее распространённым окажется ручное переименование папок на более короткие, но я нашёл более эффективное решение, которое, правда, требует установки Node.js на ваш компьютер.

    Столкнулся я с данной проблемой, когда попробовал удалить папку node_modules из очередного проекта и получил эту ошибку. Вложенность папки оказалось такой, что переименовывание каталогов заняло около получаса. Я, как и большинство программистов, довольно ленив, и повторения не хотелось. Начал искать решение и нашёл, оно подойдёт не только тем, кто знаком с Node.js и NPM, но и вполне по силам опытному пользователю Windows. Итак, начнём.

    1. Устанавливаем Node.js
    2. Устанавливаем глобально npm пакет rimraf ( открываем cmd.exe, git bash или другую оболочку для терминала Windows и вводим npm install rimraf -g и ждём установки модуля. )
    3. В том же терминале вводим rimraf "Путь\до\папки\которую\надо\удалить"
    4. ?????
    5. PROFIT

    Работает, проверено мной не раз, пример команды в терминале: rimraf "E:\project\node_modules"

    Источник

  6. 1 час назад, klierik сказал:

    А теперь... ?

    И теперь не могу, навожу на зелёный крестик, курсор не становится pointer и клики ничего не дают. Могу только отметить лучший ответ и проголосовать за него.

  7. 21 минуту назад, Igor Schnaider сказал:

    Это все потому, что у вас * { box-sizing: border-box; } куда-то пропал.

    upd. раскомментируйте в bootstrap-custom

    17 //@import "bootstrap/scaffolding"; 

    Огромное спасибо, снова выручили! Почему-то не могу + в карму поставить, возможно из-за того, что она у самого меня на нуле :(

  8. 1 час назад, by chris сказал:

    Съезжает, т.к. для колонок сетки вы добавили внешние отступы (margin).

    Я никак сетку не кастомизировал

    1 час назад, wwt сказал:

    проверяйте свой код, все работает как надо https://jsfiddle.net/2qaog703/

    Так это наверное обычный Bootstrap, у меня проблема с bootstrap-sass https://github.com/twbs/bootstrap-sass

    Если не трудно, клонируйте сборку https://github.com/Sigizmund2012/webtrends

    установите зависимости с помощью npm install и bower install, запустите gulp и увидите проблему. Нужно разобраться, если это изъян bootstrap-sass, надо им issue в репозиторий писать. Ну или я накосячил чего.

  9. Здравствуйте. Установил через Bower bootstrap-sass 3.3.6, начал верстать и столкнулся с неприятной проблемой. Код:

    <article>
    	<div class="container">
    		<div class="row">
    			<div class="col-sm-5 hidden-xs">
    				<img class="shop-pages" src="img/shop-pages.png" alt="">
    			</div>
    			<div class="col-sm-6">
    				<section class="suitable-offer">
    					<h2 class="suitable-offer__heading">Наше решение идеально подойдёт для:</h2>
    					<div class="suitable-offer__elem suitable-offer_paper-airplane"><span class="suitable-offer_first-line">Запуска стартапа</span>
    						Оптимальное решение для бизнеса, который только начинает свою деятельность в Интернете.
    					</div>
    					<div class="suitable-offer__elem suitable-offer_niche"><span class="suitable-offer_first-line">Анализа выбранной ниши</span>
    						Позволит оценить спроса на продаваемую продукцию
    						с минимальными издержками.
    					</div>
    					<div class="suitable-offer__elem suitable-offer_deadline"><span class="suitable-offer_first-line">Запуска проекта с ограниченным сроком и бюджетом</span>
    						Не нужно тратить лишние деньги на долгую
    						и сложную разработку.
    					</div>
    				</section>
    			</div>
    		</div>
    	</div>
    	<section class="stop-solution">
    
    	</section>
    </article>

    Если ставлю как сейчас col-sm-5 hidden-xs а во второй колонке col-sm-6, то всё нормально выглядит, если ставлю первой колонке col-sm-6, то 2-я съезжает вниз, как будто ей места не хватает. Бутстрап ВНЕЗАПНО поменял сетку на 11-колоночную или я не догоняю чего-то? Может issue пора писать на Гитхаб?

  10. 8 часов назад, Igor Schnaider сказал:

    Это все к вопросу о пресловутом stacking context.

    В вашем случае лучше использовать два элемента внутри обертки. http://codepen.io/anon/pen/remXzZ?editors=1100

    Большое спасибо, вот что получилось в результате

    http://hismith.smartfreelancer.ru/

    Но всё равно, при анимации линии рваные, иногда пикселизация видна. Есть ли способ сгладить всё это? Да, в Мозилле баги.

  11. 20 минут назад, Igor Schnaider сказал:

    Так а в чем проблема-то, что коряво?

    Изображение цистерны появляется сразу, и после обратной анимации исчезает, вот это мигание раздражает. нужно, чтобы она как картинка на бэкграунде поворачивалась вместе с верхним блоком, а когда курсор убирается захлопывалась обратно.

  12. Здравствуйте. Пробую использовать данное правило совместно с transition и псевдоэлементами, но браузеры уж очень коряво рендерят анимацию. Вот результат http://hismith.smartfreelancer.ru/

    При наведении на столбец происходит вращение. Кто-нибудь решал уже такую проблему, и если да, то как?

    Код:

    .jaluzi {
      display: flex;
      flex-direction: row;
      height: 90%; }
      .jaluzi__elem {
        width: 100%; }
        .jaluzi__elem:hover .jaluzi__column-content {
          transform: rotateY(180deg);
          transition: transform 1s; }
      .jaluzi__column-content {
        background: linear-gradient(to right, #b2b6bc 0%, #f4f4f5 25%);
        padding: 85px 0 0;
        transition: transform 1s;
        position: relative; }
        .jaluzi__column-content:before {
          content: "";
          position: absolute;
          background: url("../img/train.jpg") center no-repeat;
          background-size: cover;
          transform: rotateY(-180deg);
          z-index: -1;
          top: 0;
          right: 0;
          bottom: 0;
          left: 0; }

     

  13. Тоже начал изучать bootstrap, возник вопрос по поводу размеров.

    С сеткой и ячейками всё понятно.

    Но как указывать размеры колонкам? К примеру есть 2 колонки размерами 355px и 577px.

    Без бутстрапа это выглядело бы примерно так:

    http://codepen.io/anon/pen/JXPbpZ

     

    А с бутстрапом....ну укажу я количество ячеек и что....

    <div class="container">  <div class="row">    <div class="col-lg-3"></div>    <div class="col-lg-9"></div>  </div></div>

    Или добавлять ещё один класс каждой колонке.......в общем, запутался.. 

     

    А на Bootstrap верстать пиксель в пиксель и не получится, если только макет строго по его 12-колоночной сетке не выровнен, тем более, что ширина столбцов там в процентах указана.

     

    <div class="container cols-custom">  <div class="row">    <div class="col-lg-3"></div>    <div class="col-lg-9"></div>  </div></div>
    .cols-custom {  max-width: 932px;}.cols-custom[div*="col-lg-3"] {  /*width: 355px;    355÷932×100  */  width: 38.090128755%;}.cols-custom[div*="col-lg-9"] {  /*width: 577px;    577÷932×100  */  width: 61.909871245%;}

     

    Это какой-то леденящий душу пиздец, как сказал бы Лебедев.

  14. Здравствуйте. Решил сверстать шаблон с помощью Bootstrap как на скриншоте:

    539e90fa1b.jpg

     

    Стандартная 12-колоночная сетка с полями, вместо дивов решил использовать семантические теги header, footer, article, aside, nav и др. Есть несколько идей:

    <header>	<div class="container-fluid">		<div class="row">			<div class="container">				<div class="row">					<div class="col-xs-12">											</div>				</div>			</div>		</div>	</div></header>

    Можно ли контейнеры помещать внутрь других тегов? В документации Bootstrap нет ничего об этом.

    Или лучше так сделать?:

    <header class="container-fluid">	<div class="row">		<div class="container">			<div class="row">				<div class="col-xs-12">				</div>			</div>		</div>	</div></header>

    У кого опыта побольше посоветуйте как сделать.

  15. Тем, кому это действительно надо, имеет свои наработки, остальным этого много и у них есть свои наработки, поменьше и поскромней.А за тестирование, обычно, деньги платят ;)

     

    Ну например я когда искал подобную сборку, в основном попадались либо перегруженные функционалом, либо нерабочие. Перепилил чужую под себя и решил выложить, может ещё кому понравится. Платить за тестирование Open source? :rofl:

     

     

    Эта тема вообще не интересна никому? Мне этот раздел форума показался наиболее подходящим. Может стек технологий широкий слишком? Шаблоны Template Monster например почти всегда содержат Bootstrap и jQuery. Можно сверстать адаптивный шаблон по сетке Bootstrap, а потом интерфейс программировать на jQuery, по-моему удобно.

    Зачем livereload и brawsersync одновременно ? Масло-масленное, выпилите livereload.

     

    Кому чем удобней пользоваться, тот то и выберет. Настройка изменяется 1 строчкой в gulpconfig.js https://github.com/Sigizmund2012/gulp-bower-sass-jquery-and-bootstrap-Wordpress-template/blob/master/gulpconfig.jsстрока 132

  16. Эта тема вообще не интересна никому? Мне этот раздел форума показался наиболее подходящим. Может стек технологий широкий слишком? Шаблоны Template Monster например почти всегда содержат Bootstrap и jQuery. Можно сверстать адаптивный шаблон по сетке Bootstrap, а потом интерфейс программировать на jQuery, по-моему удобно.

  17. https://github.com/Sigizmund2012/gulp-bower-sass-jquery-and-bootstrap-Wordpress-templateТакже включён Autoprefixer, Normalize и на выбор BrowserSync и Livereload. Инструкция по установке на гитхабе, если кому понравится, пользуйтесь на здоровье. Найдёте синтаксические ошибки, пишите issue на гитхабе или здесь.

  18. А по поводу вёрстки будут какие-либо замечания? Может я пропустил что-то важное? Какого-то быдлокодера в соседней теме просто растерзали за табличную вёрстку, а тут молчание. То ли я такой Д'Артаньян, то ли всем на#?*ть на мою вёрстку :mellow:

  19. не удобно, для grunt\gulp есть более интересные реализации, причем с генерированием классов для спрайтов, которые можно тут же реиспользовать непосредственно в scss\less

    Compass sprites тоже генерирует классы для иконок в спрайте, сразу с нужным background-position. Grunt и Gulp пока не юзал, нужно попробовать.

  20. Здравствуйте. Верстал я значит по-старинке и вдруг решил попробовать css фреймворки, а чтоб не мелочиться, то и препроцессоры. Ранее пытался использовать grid960, не понравилось( фиксированная ширина, адаптивности нет ). Почитал доки по Bootstrap, решил попробовать вместе с препроцессором Sass и его фреймворком Compass, так что кроме работы поделюсь впечатлениями о них.

    Сайт: http://electrouslugi-nn.ru/

    Шаблон: https://yadi.sk/d/mQJWGuFtfSt4J

    В него входят подпапки psd(собственно макет), sass(файлы scss) и config.rb(конфигурационный файл sass).

    Хотелось бы получить информацию по следующим вопросам:

    1. Для каких целей служит класс .container-fluid? Пытался его использовать, но он имеет стрёмные паддинги 15px с боков, которые естественно оставляют белые поля. По-моему его с успехом заменяет div с width: 100%, или я чего-то не догоняю?
    2. Шаблон уныло смотрится в ie, даже в 9-м. Объясните пожалуйста, почему сетка сломалась?
    3. Т.к. нет макета под мобильные разрешения, верстал как Бог на душу положит, как бы вы оформили на моём месте? Для теста использовал режим адаптивного дизайна в Мозилле.
    4. Посоветуйте действительно полезные миксины Compass, те что я видел в основном направлены на поддержку старых ie.
    5. Разбил файлы scss на группы: _base.scss( тут шрифты и цвета ), media.scss(медиа-запросы), style.scss(основной файл). Правильно ли я поступил? Посоветуйте полезные приёмы для работы с sass.

    Мои впечатления:

    1. В Bootstrap слишком много кода, из которого must have только сетка, всё остальное сомнительной полезности. В принципе можно кастомную сборку использовать.
    2. Порадовал миксин Compass для создания спрайтов, действительно полезная штука. Ну и nesting sass конечно.
    3. Препроцессор не слишком ускорил разработку, думаю он актуален только на больших проектах. Можно быстро менять цветовую схему, просто поменяв значения переменных, и не надо лазить по всем файлам css с поиском и заменой.

    Буду рад конструктивным комментариям и советам :)

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy