mankutila
Newbie-
Posts
17 -
Joined
-
Last visited
mankutila's Achievements
Explorer (1/14)
0
Reputation
-
При верстке лендинга возникла проблема: необходимо, чтобы первый экран вмещал в себя все элементы, которые представлены на скрине. Однако, по задумке дизайнера круглые плашки с логотипом и брендами должны быть как бы "лампами", которые связаны с фоновой картинкой блока. Дизайн сделан для разрешения 1600х900, меньший не представлен. Соответственно, если попытаться посмотреть на 1920х1024 или 1366х768, то высота первого экрана 900 это слишком много. Как постепенно уменьшать и кружки, и фоновую картинку, чтобы они совпадали и при этом помещались на первый экран? Вариантов перебрали уже много: сделать кружки картинкой, сделать блоками. В первом случае при уменьшении экрана картинка перестает помещаться в вьюпорт, а во втором - катастрофически не совпадает с фоном. Ситуация осложняется тем, что между блоком с фоном и блоками-лампами нужно поместить еще один блок, который будет анимироваться, т.е. в одну картинку и фон, и кружки не слепить. Как выйти из этой ситуации? Может, кто-то сталкивался с подобным?
-
Добрый день. На сайте нужно реализовать подобное: А именно интересуют пунктирные линии между блоками, их вообще возможно сделать силами CSS? Пока вставила картинкой весь блок, но это не очень устраивает, потому что нужен редактируемый текст в блоках. Спасибо.
-
Проблемы с всплывающей формой в разных браузерах
mankutila replied to mankutila's question in HTML Coding
Это не странности, в исходном состоянии формы в самом низу скрыты, но по наведению на кнопки jquery .append() они перемещаются и становятся видимыми -
Доброго времени суток. Имеется сайт на тестовом домене На главной странице есть кнопки, по наведению на них появляется (-ются) форма (-ы). Так вот, с этими формами обнаруживаются несколько проблем в разных браузерах: 1) в IE 11 этой формой невозможно пользоваться - она просто не реагирует ни на какие действия. Плюс, в исходном коде обнаруживаются какие-то закрывающие теги для всех <input type="text"> 2) в FF ввод данных в формы просто осложнен: начинаешь вводить одну букву, две и инпут тут же теряет фокус, я не понимаю, с чем это связано. В хроме все работает. Хотя и там есть нюанс: почему инпут держит фокус только тогда, когда на нем стоит указатель мыши? Если кто-нибудь сталкивался с такими проблемами или знает, что с этим делать, помогите пожалуйста. Спасибо. UPD: форма так себя ведет, потому что добавляется внутрь элемента, по которому кликают - функция появления формы вызывается снова и снова, надо думать, как добавить форму вне кнопки, но еще и позиционировать ее относительно ее
-
Как из разных мест открывать одну и ту же форму
mankutila replied to mankutila's question in HTML Coding
Спасибо! Проблема решилась. Только к offset нужно еще воспользоваться scrollTop, чтобы форма позиционировалась относительно верха вьюпорта, а не относительно начала документа -
Доброе время суток. На сайте есть 5 одинаковых кнопок .main-btn, по наведению на которые под кнопкой появляется форма .popover-form. <div class="main-btn free-call"> <p><a href="#">Воспользуйтесь бесплатным обратным звонком</a> <br/> <i class="glyphicon glyphicon-chevron-down"></i> <form class="popover-form question-form"> <label for="">Ваше имя</label><input type="text"> <label for="">Ваш E-mail</label><input type="text" value=""> <label for="">Задайте вопрос:</label> <textarea></textarea> <button>Задать вопрос</button> </form></div>Я убрала из кода кнопок .main-btn формы, чтобы их не было 5 разных, а всего одна. Вставила код формы в конец документа. .При наведении на кнопку, форма показывается с помощью jQuery . Но вот проблема: когда форма была внутри кода кнопки, все было хорошо с позиционированием, поскольку у формы установлео top: 87px (высота кнопки) и она появлялась строго под кнопкой, независимо от того, на какую из 5 кнопок я навожу указатель. А в конце документа position: absolute у формы срабатывает уже относительно body, мне это не нужно. Как сделать так, чтобы и форма была одна-единственная, и чтобы под всеми кнопками появлялась корректно? Спасибо.
-
Картинка сама по себе шириной 1920px, так вот на меньших экранах она должна не уменьшаться, а просто выходить за края, но быть центрированной. Но это по-моему уже не проблема, спасибо)
-
Добрый день. Есть макет, в котором предусмотрен главный экран (верхняя часть сайта без основного контента). Нужно, чтобы этот экран занимал весь вьюпорт по высоте и ширине и был адаптивным, то есть на всех экранах (начиная с ширины в 1000px) при открытии сайта все пространство должен занимать этот экран. Также нужно, чтобы картинка на фоне тоже была адаптивной (background-size: cover дал не совсем тот эффект, сама картинка должна центрироваться, а не уменьшаться пропорционально). Как это реализовать? Заранее спасибо. P.S. На картинке тот самый главный экран (шапка, блок с "можем-получаете" и блок "хотите..."). Ниже в макете идет основной контент (простой текст).
-
Добрый день. Есть проблема: на сайте с админкой WP существует категория "Статьи". соответственно существует страница /category/articles, которая оформлена как блог (с архивом и проч.). Эта страница не нужна. Как ее убрать, чтобы не повердить категорию "Статьи", поскольку записи из этой категории используются на других страницах?
-
Спасибо.
-
С помощью чего (библиотеки, инструменты) лучше всего делать такой слайдер? То есть, картинки должны перемещаться при нажатии на кнопки сверху
-
Как грамотно организовать наложение двух блоков
mankutila replied to mankutila's question in HTML Coding
position:relative / absolute для вырезанной картинки с этими полосочками? _____ спасибо, разобралась -
Добрый день! Подскажите, как грамотно организовать такое наложение? То есть, не просто наложение, а по определенному паттерну что ли (я имею в виду эти линии серого цвета, которые накладываются на верхний блок)
-
Многослойный хэдер - как лучше реализовать?
mankutila replied to mankutila's question in HTML Coding
Спасибо!!