• Как сверстать такой сайт?

    @slaffko_name
    Ответ написан
    Комментировать
  • Как реализовать уровни доступа к файлам на вебсервере?

    @green_goo
    Убрать требуемые файлы за корень веб сервера. Отдавать их с помощью readfile
    Ответ написан
    5 комментариев
  • Как сверстать шапку такой формы?

    lukoie
    @lukoie
    Вот тут описываются все способы решений:
    https://css-tricks.com/creating-non-rectangular-he...
    Ответ написан
    Комментировать
  • Как правильно стилизовать плеер youtube на сайте?

    @Egor1324 Автор вопроса
    РЕшил проблему с fullscreen при помощи js кода:
    function toggleFullScreen(elem) {
        	if ((document.fullScreenElement !== undefined && document.fullScreenElement === null) || (document.msFullscreenElement !== undefined && document.msFullscreenElement === null) || (document.mozFullScreen !== undefined && !document.mozFullScreen) || (document.webkitIsFullScreen !== undefined && !document.webkitIsFullScreen)) {
        		if (elem.requestFullScreen) {
        			elem.requestFullScreen();
        		} else if (elem.mozRequestFullScreen) {
        			elem.mozRequestFullScreen();
        		} else if (elem.webkitRequestFullScreen) {
        			elem.webkitRequestFullScreen(Element.ALLOW_KEYBOARD_INPUT);
        		} else if (elem.msRequestFullscreen) {
        			elem.msRequestFullscreen();
        		}
        	} else {
        		if (document.cancelFullScreen) {
        			document.cancelFullScreen();
        		} else if (document.mozCancelFullScreen) {
        			document.mozCancelFullScreen();
        		} else if (document.webkitCancelFullScreen) {
        			document.webkitCancelFullScreen();
        		} else if (document.msExitFullscreen) {
        			document.msExitFullscreen();
        		}
        	}
        }


    Но появилась другая проблема, при двойном клике по Youtube плееру, он становиться fullscreen и перекрывает мою панель, как можно этот двойной клик блокировать ?

    Что бы по двойному клику не открывался fullscreen нужно для iframe в css прописать:
    user-select: none;
    pointer-events: none;
    Ответ написан
    1 комментарий
  • Как настроить Wi-Fi роутер на показ определенной страницы?

    RicoX
    @RicoX
    Ушел на http://ru.stackoverflow.com/
    Шо опять? Ну сколько же можно, Captive Portal зовется это, чего же вас всех в гугле то банят.
    Ответ написан
    Комментировать
  • Правильно ли названы классы по БЭМ?

    Alex_Wells
    @Alex_Wells
    PHP/TS/Kotlin developer
    Зачем так сложно..

    <section class="testimonials">
    	<div class="container">
    		<div class="wrapper">
    			<div class="item">
    				<div class="img"><img alt="Q" src="img/photo/testimonial.png"></div>
    				<div class="text">
    					<p>"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation.”</p>
    					<h4>Joe Doe</h4>
    				</div>
    			</div>
    			<div class="item">
    				<div class="img"><img alt="Q" src="img/photo/testimonial.png"></div>
    				<div class="text">
    					<p>"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation.”</p>
    					<h4>Joe Doe</h4>
    				</div>
    			</div>
    		</div>
    	</div>
    </section>
    Ответ написан
    1 комментарий
  • Какой фреймворк выбрать для обучения?

    glebovgin
    @glebovgin
    Full Stack Web Developer
    А я бы как раз CI и порекомендовал при условиях "сжатые сроки" и "критично: порог входа, т.е. время на "вьезжание" в архитектуру.".
    Ответ написан
    Комментировать
  • Какой бюджетный ноутбук выбрать для веб-разработки?

    Сижу на Lenovo B50-30 (Celeron N2840, встроенное видео) в минимальной комплектации. Памяти было 2 гига - продал, купил планки по 8, жесткий поставил собственный. Обошлось в 17к. Огромный плюс - пассивное охлаждение и сменная клавиатура. Можно работать хоть на диване, хоть на улице, и не беспокоиться о том, что внутри все зарастет пылью. Клавиатура легко меняется - если случайно опрокинуть кофе, последствия будут гораздо менее плачевные, чем у менее модульных систем.

    Быстрый, тихий ноут, могущий тянуть без перегрева даже игры - XCOM прошел на нем.
    Ответ написан
    8 комментариев
  • Как правильно передавать пароль?

    xmoonlight
    @xmoonlight
    https://sitecoder.blogspot.com
    Очень много ошибок!

    1. При регистрации - никогда не отправляется пароль в чистом виде на сервер! Он вначале хэшируется, затем шифруются все регистрационные данные с использованием открытого ключа сервера внутри приложения, подписывается этим ключом и только после этого всё отправляется на сервер. Сервер - никогда не должен знать пароля. Он должен иметь возможность лишь проверять сам факт совпадения подписанных данных авторизации! Т.е. два поля: логин и hash на основе различных данных, включая публичный ключ: логин+пасс+...+...

    2. Авторизация - CRAM-MD5 (Challenge-Response), используем ту же механику что и в CRAM-MD5, только хешируем более стойким алгоритмом и.. ВНИМАНИЕ! подписываем открытым ключом. И только после этого - отсылаем серверу на проверку. В случае успеха - получаем TOKEN сессии от сервера.

    3. Общение/обмен данными - формируем json, шифруем эти данные с помощью открытого ключа, подписываем (формируем hash для передаваемого серверу сообщения) на основе следующих данных: выданный сервером TOKEN, TIMESTAMP и RANDOM. Добавляем в "хвост" шифрованные TIMESTAMP (время) и RANDOM(случайная строка). Это нужно для предотвращения повторных запросов задним числом.

    подробнее
    Ответ написан
    2 комментария
  • Как без костылей сделать так, чтобы footer сайта всегда был внизу?

    @dmz9
    не бойся добавить обертку к разметке, от этого никто еще не умер.
    есть всего 2 случая:
    1. высота футера заранее известна и жестко можно её указать. в этом случае обычно использую вот такое
    <html>
    <head>
    <style type="text/css">
    * {
        /* обычно все нормальные адекватные верстальщики юзают css-reset поэтому 
        тут просто масло-масляное. такие правила в нем всегда есть, но они необходимы на самом деле.*/
        padding: 0;
        margin: 0;
        box-sizing: border-box;
    }
    
    body,
    html {
    	background-color: orange;
        height: 100%;
        /* растягиваем корневой элемент и боди на всю высоту окна браузера. 
        да, даже если контента 10 страниц - эти элементы будут именно по размеру окна */
    }
    
    .wrapper {
        min-height: 100%;
        /* обертка должна быть не-меньше чем всё окно целиком. это растягивает враппер 
    на всю высоту окна браузера (как минимум). если контента больше чем одна страница - 
    правило будет просто опускаться, и враппер будет заниматься столько, сколько нужно  */
        padding-bottom: 80px;
        /* вообще, указывать надо чуть больше, либо добавлять main отдельный нижний маржин. 
    если этого не делать футер будет очень близко к main поэтому нужен отступ. 
    обычно 15-16 пикселей (спейсер) */
    }
    
    footer {
    	background-color: green;
        height: 80px;
        /* мы знаем высоту футера и указываем ее */
        margin-top: -80px;
        /* основная суть всего способа - отрицательный верхний маржин затягивает футер наверх на всю 
    собственную высоту футера. соль в том что враппер, идущей по потоку документа перед футером уже занял 
    всю высоту окна. и если мы этого не сделаем то футер всегда будет ниже нижней границы окна 
    даже когда контента не будет, плюс, появится полоса прокрутки. отрицательный маржин 
    нивелирует этот эффект и футер оказывается "прибит" к полу */
    }
    </style>
    </head>
    <body>
        <div class="wrapper">
            <header></header>
            <main>я майн</main>
        </div>
        <footer>пыщщ пыщщ</footer>
    </body>
    </html>

    если используется less/sass то еще проще - заводим переменную (типа $footer_height) и юзаем ее и в паддинге (padding-bottom:$footer_height+15px) и в стилях футера (height:$footer_height; margin-top:-1*$footer_height;). замена высоты футера будет в одном месте (dry!)
    2. второй вариант - высота может меняться - в основном у адаптивных сайтов.
    расскажу как обойтись без флексбокс но нужно немного JS.
    за высотой футера следит скрипт, и при каждом ресайзе страницы обновляет высОты и маржины/паддинги. использовать jquery проще всего, плюс, он почти всегда есть почти везде.
    выглядит примерно так.
    <html>
    <head>
        <style type="text/css">
        * {
            padding: 0;
            margin: 0;
            box-sizing: border-box;
        }
        
        body,
        html {
            background-color: orange;
            height: 100%;
        }
        
        .wrapper {
            min-height: 100%;
            /* теперь паддинг не нужен */
            /* погорячился - все таки нужен )) */
           padding-bottom:80px;
        }
        
        footer {
            background-color: green;
            min-height: 80px;
            /* чтобы футер не схлапывался в нулевую высоту когда в нем пусто */
            height: 80px;
            margin-top: -80px;
            /* можно не убирать, чтобы оставить совместимость с чем то без JS */
        }
        </style>
    </head>
    <body>
        <div class="wrapper">
            <header></header>
            <main>я майн</main>
        </div>
        <footer>а я футер! ололо</footer>
        <script src="http://code.jquery.com/jquery-2.2.4.min.js" type="text/javascript"></script>
        <script type="text/javascript">
        $(document).ready(function() {
            // сначала подождем загрузки
            // объявим переменные, чтобы заново не выбирать каждый раз те же ноды
            var footerHeight, $footer = $('footer'),
                $main = $('main');
            $(window).resize(function() {
                // вешаем обработчик на изменение размеров страницы - т.е. если меняется ширина страницы, 
                // или высота, даже если в футер кто то потом аяксом что то подгрузит - 
                // сработает ресайз и все сам поменяет
                footerHeight = $footer.height('auto').height();
                // важный момент - чтобы "снять" правильную высоту элемента - надо чтобы поток документа сам 
                // назначил верную высоту футеру. а для этого сделаем её "auto". даже если забыли/не захотели убрать 
                // из стилей жестко прописаную высоту - инлайн стиль перебивает весом, и поэтому высота 
                // будет такая "как надо". потом снимаем мерку, и юзаем её
                $main.css({
                    'paddingBottom': (footerHeight + 15)
                });
                // не забываем кемел-кейс для значений-через-дефис
                $footer.css({
                    'height': footerHeight,
                    'marginTop': (footerHeight * -1)
                })
            }).trigger('resize'); // после навешивания обработчиков насильно запускаем первый ресайз
        })
        </script>
    </body>
    </html>

    ------------------------------
    варианты с позиционированием крайне не люблю - дело не в том что я не умею с ним обращаться. я то как раз таки умею, а вот многие другие делают из этого лютые костыли, которые потом заколебешься переделывать. так что лучше не используйте позиционирование там, где оно не нужно (в прибитии футера к полу например).
    то что бутстрап использует позиционирование в своём прибитом футере не значит что это супер-правильно или это best-practices. просто они решили сделать так а не как то иначе.
    Ответ написан
    1 комментарий
  • Как без костылей сделать так, чтобы footer сайта всегда был внизу?

    lightalex
    @lightalex
    header и footer обычно имеют четкий height
    В таком случае для main задать min-height: calc(100vh - 200px); // где 200px это высота header + высота footer
    Я предпочитаю для кроссбраузерности добавлять перед этим min-height: 100%; min-height: calc(100% - 200px);
    И не забудьте прописать html, body {min-height: 100%;}
    Ответ написан
    Комментировать
  • Были ли у вас проблемы с HelveticaNeue шрифтом?

    EaGames
    @EaGames
    Front-end developer
    просто шрифт кривой, держите его из моей колекции
    Ответ написан
    2 комментария
  • Как это правильно написать с использованием SCSS?

    andykov
    @andykov
    Shit happens
    &.active {
            &__lines {
              ...
            }
        }

    Компилируется в .navicon.active__lines:before поэтому и не работает.
    Вешайте active на .navicon__lines, помимо этого в стилях еще нужно дописать.
    Итог
    Ответ написан
    7 комментариев
  • С каких пор появился фронтенд?

    @dmtrrr
    Backend developer
    В 2006 году появился AJAX, это сильно изменило мир фронтенда. Тогда и начался перелом.
    Ответ написан
    4 комментария
  • Знания Junior php разработчика?

    @Alzasr
    Твой уровень знаний, если ты все честно описал, достаточен для джуниора и мб даже больше. Как я понял, ты хорошо обучаешься. Можешь легко идти на вакансии джуниоров, а через полгода-год стать мидлом. Если ты живешь в Ижевске, обращайся, готов тебя взять, правда после общения с HR, к себе в отдел.
    Ответ написан
    Комментировать