Search the Community
Showing results for tags 'css3'.
-
Пытаюсь реализовать кнопку необычной формы. Проблем с кнопкой не было, до того момента, как встала задача добавить при наведении эффект glow. Вот тут то и вышли проблемы. Сам пример тут. Если кратко то куски кнопки, которые эмулируют скосы отображаются как части, а не как единое целое. При ховер у меня также меняется прозрачность. По кнопке перерыл весь инет, нашел вот это. Но в основном эти реализации либо не работают с бордером, либо поддержка в браузерах малая(clip-path). В общем был бы благодарен за помощь.
-
Требования: Опыт работы с веб-технологиями от 3-x лет Хорошее знание JavaScript Опыт работы с шаблонами JavaScript MVC/MVVM, фреймвoрками и библиотеками AngularJS, jQuery, Bootstrap Хорошее знание сопутствующих технологий: HTML, HTML5, CSS Опыт объектно-ориентированного программирования (OOP) в JavaScript Понимание протокола WebSockets Обязанности: Проектирование пользовательских интерфейсов Реализация frontend приложений Написание документации по разработанным модулям Условия: Оформление согласно ТК РФ Профессиональный и карьерный рост Стабильность и конкурентоспособная заработная плата Программы развития: конференции, семинары, курсы, тренинги Работа в офисе, Москва, м.Ботанический сад / Работа удаленно Размер компенсации обсуждается по результатам собеседования Alexandra M | HR Manager | Altarix Mobile: +7 929 540 40 69| Skype: alexfoxsy | am@altarix.ru
-
Всем добрый день! При добавлении div'у background-image возник вопрос: а как объяснить элементу, какую именно часть картинки нужно отобразить, если я, скажем, ставя фоновое изображение разрешением 1920x1080, задаю div'у высоту 500px (или любое другое значение меньше 1080px), и при этом хочу, чтобы изображение было обрезано не снизу, а сверху? Заранее спасибо
-
Как сделать горизонтальные и вертикальные линии на сайте?
kot_Bazilio posted a question in HTML Coding
Доброго дня, уважаемые! Только-только приступил к изучению основ вёрстки веб-сайтов, верстаю первый макет для тренировки. Возник следующий вопрос: как при помощи html5 и css3 добавить на сайт горизонтальные и вертикальные линии? Наглядный пример того, о чём я говорю - линия внизу страницы этого форума. Вот об этой линии я говорю. Заранее спасибо -
Делаю форму (HTML5) и столкнулся с такой проблемой. Если указывать атрибут required для input, то стили для этого поля автоматически с дефолтных значений меняются на те, которые я прописал в input:invalid (как я понял, так работает валидация формы). А как сделать, чтоб и проверка работала, но применялись стили по умолчанию, а стили input:invalid применялись если введенная инфа не соответствует тому, что я прописал в атрибуте pattern для input?
-
Компания Банк Софт Системс (разработчик ПО для банков) Ожидания от кандидата: React/FluxBower/WebpackHTML5/CSS3/LessGIT/SVNПриветствуется: Знание паттернов проектированияОпыт работы с Cordova/PhoneGapСледование codestyle и соблюдение культуры кода (jscs/jshint)Опыт разработки в команде (agile/scrum)Знание других языков программированияОпыт создания автоматизированных тестов (Selenium/Mocha)Использование в разработке принципов Progressive Enhancement/Graceful DegradationМы предлагаем: Работа в Центре перспективных технологий, в котором мы ценим творческий подход, позволяющий элегантно решать интересные и сложные задачиМы продвигаем мир банковского софта на шаг дальше. В своих проектах мы внедряем технологии, находящиеся на пике банковских трендов (Omni-channel/Распознавание голоса/NFC/...)Используем адаптивные технологии(web stack + cordova) и добиваемся того, чтобы интерфейс наших приложений работал с нативной отзывчивостью (профилируя/оптимизируя анимацию)Занимаемся парным программированием, agile, trello/kanbanОфис м. НагатинскаяГрафик 9.00-18.00/10.00-19.00ТК РФ, белая заработная платаСоциальные условия: ДМС (включает сеть ведущих клиник и стоматологию, страховку выезжающих за рубеж)льготные кредитыкорпоративные мероприятия и подарки, детские праздникисвоя футбольная команда и команда по настольному теннису, участие в корпоративных турнирахВопросы и резюме присылайте: n.chaika@bssys.com
-
Пытаюсь в шапку сайта установит разные изображения адаптированные под размеры устройств. И столкнулся с интересным эффектом от которого мозги закипают. Проблема: картинки правильно показываются только при условии если переход по ссылке идёт с первого самого верхнего уровня меню. Если переход с дочернего уровня, то картинки нет даже запасного варианта только его alt. Но если поставить картинку фоном через css или одно изображение без тега picture, то всё прекрасно работает. Сайт на локальном и на джумле. Пробовал html вариант меню эффекта нет. Скипт отключал. В этих всё работает хорошо ссылки на первом уровне. <li class="item-101 current active"><a href="/index.php">Главная</a></li><li class="item-117 current active deeper parent"><a href="/index.php/botinki">ботинки</a>Это дочка - внучка, второй строки которая ботинки. Картинок нет только alt. <li class="item-119 current active"><a href="/index.php/korotkie/zheleznye/variant-1">Вариант 1</a></li>Люди добрые киньте пожалуйста идею куда копать надо, а там методом научного тыка ...
-
Какую литературу посоветуете для полного изучения CSS3?
edvard200018 posted a question in HTML Coding
Добрый день уважаемые форумчане(может быть вечер, а то и утро)! Накопал на ОЗОНЕ следующую литературу: 1. Брайан Хоган. "HTML5 и CSS3. Веб-разработка по стандартам нового поколения" 2. Рейчел Эндрю. "CSS. 100 и 1 совет" 3. Дэвид Сойер Макфарланд. "Большая книга CSS3" 4. Зои Джилленуотер. "Сила CSS3. Освой новейший стандарт веб-разработок!" 5. Владимир Дронов. "PHP, MySQL, HTML5 и CSS 3. Разработка современных динамических Web-сайтов" Какой из них посоветуете, или какой-нибудь свой учебник? Но надо чтобы CSS прям с нуля был до профессионального уровня... -
Здравствуйте! Подскажите как можно сверстать вот такую фигуру Каждая из трех составляющих пентагона должны быть кликабельны (ссылки), а также поверх них должен быть текст. Для каждой составляющей будет разный фон в виде картинки. Как все это сделать средствами CSS и HTML? Желательно максимально кроссбраузерно. Заранее благодарен!
-
Здравствуйте, друзья! Подскажите, пожалуйста, как сделать так, чтобы высота страницы (например вот этой - http://toolbird.com/signup/)отображалась на любом десктопном устройстве тютелька-в-тютельку под размер экрана, без скроллинга. Речь идет о верстке в Bootstrap3, но с благодарностью приму и другие возможные решения. Спасибо большое!
-
Друзья, добрый день! Помогите, пожалуйста. Нужно сделать респонсив верстку. Вот на этой странице - http://toolbird.com/list/time-tracking-tools/- когда уменьшаешь до размера смартфона, то в теле (в разделе Suggestions) плывут кнопка, минифото, и тайтл с текстом под ним. Надо сделать, чтобы кнопка и фото оставались в одной строке, а тайтл с текстом опускался под них. Спасибо большое!
-
как сделать такие часы? Здесь файлы но часы работают только после обновления страницы: https://yadi.sk/d/EsSIIvpGiYfmn Пытался воссоздать http://jsfiddle.net/enwmps9o/79/
-
Впервые кому-то показываю свою работу, может что-то подскажите, может что-то явно неуместно, криво, категорически неправильно. К критике отношусь спокойно, даже привествую http://ketkin.pro/
-
Существует несколько методов вывода иконки навигации(три горизонтальных линии) на сайте кто-то просто вставляет png иконку, кто-то делает с помощью border`a, кто-то использует box-shadow, кто-то градиенты, кто-то svg. кто-то псевдо-элементы. я не сильно силен в этой теме, но понимаю, что мне хотелось бы менять, к примеру, цвет иконки в зависимости от цвета фона шапки, поэтому я хотел бы иметь возможность гибко работать с иконкой. Суть вопроса, кто какой метод использует и какие плюсы/минусы разных методов. п.с. Кто-то подключает иконочный шрифт, вопрос такой, имеет ли смысл грузить мобильный трафик подключением этого шрифта ради 1-2 иконок?? или это не особо влияет на скорость загрузки сайта?
-
Требуется front-end "Гуру" чтобы создать два экзаменационных задания: для экзамена по HTML5 и для экзамена по CSS3. Ключевой момент состоит в том, чтобы создать задания супер-интересные для решения. "Свой" разработчик, также довольно высокого уровня, такого придумать не может. Хотелось бы найти такого специалиста, который: - имеет многолетний опыт работы с HTML и CSS - матёрый практик - знает, какими "вкусными" бывают некоторые задачи, а какие - тоска и рутина. - пользуется Skype (текстинг) Хотеслось бы, чтобы экзаменационные задачи получились: - Жуть какие интересные для решения! - Успешным решением хотелось бы гордиться - Решение не требовало знания супер-редких функций и синтаксиса, а сообразительности и смекалки. Более подробно о формате и процессе экзамена можно будет узнать при интервью. Срок исполнения - до 7 дней. Можно взяться только за один экзамен из двух. Оплата по договоренности. Плюшки: Информация об авторе такого успешного экзамена будет размещена на сайте экзамена. Вы сможете заявить о себе как о Top-Level профессионале, включить ссылки на свои проекты/контакты, разрекламировать себя как специалиста. Пожалуйста присылайте Ваши предложения на email nfm2002@mail.ru или пишите прямо здесь, как удобней Спасибо!
-
Господа, есть элементарный сайт визитка, насколько это возможно, на пк все вроде неплохо, без глюков, сделан по принципу mobile first, но на планшете, если нажимать на пункты меню, буквально долисекунды я вижу, как верстка съезжает, это очень напрягает, делал я его флексбоксами, может кто подскажет, что и где и сделал неправильно? Сайт пока находится по адресу anvyd.ru
-
Доброй ночи, уважаемые форумчане! Не подскажете, как создать такой блик исключительно на css. Просто вырезать и вставить блик как-то не круто( А других идей у меня пока нет... http://clip2net.com/s/3j79hmY
-
Добрый день, подскажите с вопросом, как на адаптивном сайте сделать фоновое изображение, которое остается на своем месте (обрезается) при уменьшении экрана. Картинка для наглядности : http://s016.radikal.ru/i337/1506/6e/53922c9e96df.png
-
Мы - команда из 2-ух человек. Занимаемся разработкой веб-проектов с уникальным дизайном, готовы взяться за предложения различной сложности, а главное делаем свою работу с любовью и выполняем все точно в сроки. У каждого из Нас есть свои задачи: Front-end разработчик - Занимается разработкой дизайна и его реализацией на сайте. Прежде чем начать воплощать все идеи в “код”, заранее продумывает цветовую палитру, как все должно выглядеть, взаимодействовать, что нужно использовать, а от чего стоит отказаться. Стек технологий: HTML5 CSS3 JS jQuery Gulp Sass Bootstrap UI Kit Back-end разработчик - Занимается разработкой сайта “изнутри”. Именно он заставляет выдавать информацию о пользователях или новостях, без него невозможны были бы регистрация, добавления новостей или файлов, вывод статистики и многое другое. Так же как и Front-end разработчик перед началом работы все тщательно продумывает - как все должно взаимодействовать, какой должна быть БД в целом, продумывает всю функциональность сайта. Стек технологий: Python Django PostgreSQL MySQL Linux(Ubuntu) Nginx Дизайн рисуется в PhotoShop, а его наброски на обычном листе бумаги. Весь код мы храним на BitBucket. Наша почта: codymakers@gmail.com Skype: codymakers
-
добрый день ! оцените верстку, по критикуйте, что не так, как должно быть http://cyberverstka.hol.es/
-
Скошенная сторона у блока произвольной высоты, IE8 и выше, как реализовать?
Shiza posted a question in HTML Coding
Необходимо реализовать блок со скошенной стороной, как на картинке: Нагуглить решение мне не удалось. Есть ли способ такое реализовать IE8 и выше, желательно без использования картинок? -
Вроде бы несложная задачка, но споткнулась на ней. Нужно, чтобы сам текст не обтекал буллит. Так: Сверстано так: a:before{ content:''; display:inline-block; width:6px; height:6px; border-radius:50%; background:#464646; margin-right:8px; vertical-align:middle;}Возможно ли это?
-
Доброго времени суток уважаемые форумчане! У меня такая проблема. Хочу добиться эффекта вдавленного текста с помощью css3, принцип как это работает понимаю, но есть небольшое НО. В моем случае имеется такой стиль: .navbar { padding-right: 20px background-color: #2C2C2C; background-image: -moz-linear-gradient(center top , #333, #222); background-repeat: repeat-x; border-radius: 0px; box-shadow: 0px 5px 3px rgba(0, 0, 0, 0.25), 0px -1px 0px rgba(0, 0, 0, 0.1) inset; padding-left: 20px; background-attachment: scroll;}h1 { color: #151515; padding-top: 5px; font-weight: 900; font-size: 50px; font-family: Arial, Tahoma, Verdana, sans-serif; text-shadow: -2px -2px 1px rgba(70, 70, 70, 0.1), 2px 2px 1px rgba(70, 70, 70, 0.1);}вот так он выглядит в браузере, кидаю ссылку, потому что не получается прикрепить скрин: http://joxi.ru/8AnBYLxFzPL4AO Эффекта как видите нет, бэкграунд дива с градиентом, на тексте градиента нет конечно же, думаю в этом причина. У кого какие мысли по этому поводу, есть ли решение данной проблемы? ps: хочу использовать только css3, не хочу использовать просто картинку сделанную в фотошопе Всем кто откликнулся на мою тему, заранее спасибо=)
-
Добрый день уважаемые форумчане! Есть страничка на которой крутится видео. При наведении мышкой на видео оно плавно разворачивается на весь экран. Можно ли сделать так чтобы тот же эффект разворачивания срабатывал при обнаружении в текстовом файле символа "1". Т.е. появилась единица картинка развернулась, появился ноль свернулась, но чтобы без перезагрузки видео... Пример текущего кода... <!doctype html><html lang=en><head><title>Видео HTML5 с переходными эффектами</title><meta charset=utf-8><style>html { background: #000000; }body { width: 100%; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: 0.9em; line-height: 1.2; color: #222;}a { color: #227; }pre { border: 1px #ddd solid; background: #FF9; font-size: 1.2em; padding: 1em; }video { width: 100%; -o-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out;} video:hover, video:focus { width:300px; }</style></head><body><video autoplay loop src="1.mp4" type='video/mp4'></video></body></html>
-
Доброго времени суток. Подскажите, как решить задачу в IE. Вот ссылка: http://codepen.io/anon/pen/uzHfb - footer с треугольником на CSS3 через псевдотег :before. В Firefox и Chrome под Win7 - всё ок, треугольник по центру, а в IE11 (в младших тоже наверное) - треугольник смещен влево. Та же история (смещен влево) и в Chrome на Android. Заранее благодарю за помощь.
