- Поисковые системы
- Практика оптимизации
- Трафик для сайтов
- Монетизация сайтов
- Сайтостроение
- Социальный Маркетинг
- Общение профессионалов
- Биржа и продажа
- Финансовые объявления
- Работа на постоянной основе
- Сайты - покупка, продажа
- Соцсети: страницы, группы, приложения
- Сайты без доменов
- Трафик, тизерная и баннерная реклама
- Продажа, оценка, регистрация доменов
- Ссылки - обмен, покупка, продажа
- Программы и скрипты
- Размещение статей
- Инфопродукты
- Прочие цифровые товары
- Работа и услуги для вебмастера
- Оптимизация, продвижение и аудит
- Ведение рекламных кампаний
- Услуги в области SMM
- Программирование
- Администрирование серверов и сайтов
- Прокси, ВПН, анонимайзеры, IP
- Платное обучение, вебинары
- Регистрация в каталогах
- Копирайтинг, переводы
- Дизайн
- Usability: консультации и аудит
- Изготовление сайтов
- Наполнение сайтов
- Прочие услуги
- Не про работу
Как снизить ДРР до 4,38% и повысить продажи с помощью VK Рекламы
Для интернет-магазина инженерных систем
Мария Лосева
Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий
Доброго времени суток. Такая возникла проблема: имеются 3 блока. Необходимо сделать так, чтобы при выборе блока №1
и нажатии на кнопку "Далее" всплывало окно. При выборе блока №2 и нажатии кнопки "Далее" - всплывало тоже самое окно. А уже выбрав блок №3 и нажав на кнопку "Далее" происходила бы переадресация на другую страницу. Как такое можно сделать?
HTML страницы
JS для блоков
$(document).ready(function(){ $('.content .block').click(function(){ $('.content .block').removeClass('active'); $(this).addClass('active'); }); });CSS для блоков
.content .block { border: 2px solid #ddd; padding: 0px; text-align: center; vertical-align: middle; position: relative; cursor: pointer; margin-bottom:10px; } /* Hover */ .content .block:hover:after { content: ''; position: absolute; top: 0px; right: 0px; bottom: 0px; left: 0px; border: 3px solid #ffe5c5; } /* Click */ .content .block.active:after { content: ''; position: absolute; top: 0px; right: 0px; bottom: 0px; left: 0px; border: 3px solid orange !important; }CSS для окна
.mization { position: fixed; font-family: arial; font-size: 83%; top: 0; right: 0; bottom: 0; left: 0; background: rgba(14, 14, 14, 0.52); z-index: 99999; opacity: 0; -webkit-transition: opacity 400ms ease-in; -moz-transition: opacity 400ms ease-in; transition: opacity 400ms ease-in; pointer-events: none; } .mization:target { opacity:1; pointer-events: auto; } .mization > div { width: 523px; position: relative; margin: 5% auto; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; background: #fff; } .mization .dcovaeckponug { padding: 8px 21px 7px 21px; min-height:200px;} .dcovaeckponug { background: #e2e2e2; border-top: 1px solid #9c9696; -moz-box-shadow: inset 0px 13px 12px -15px #757474; -webkit-box-shadow: inset 0px 13px 12px -15px #615959; box-shadow: inset 0px 13px 12px -15px #312e2e; } .dcovaeckponug p { color: #bd371d; text-align: right; margin: 0; padding: 5px; } .vas, .gameos, .nugpemen { background: #4a4a4e; color: #f1ebeb; line-height: 24px; text-align: center; text-decoration: none; font-weight: bold; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; -moz-box-shadow: 1px 1px 3px #000; -webkit-box-shadow: 1px 1px 3px #232121; box-shadow: 1px 1px 2px #484444; padding: 1px 1px 0px 3px; } .vas, .nugpemen { width:75px; float:right; margin-left:18px; } .vas:hover { background: #0a5477; } .nugpemen:hover { background: #D4482D; } .ditional { float:none; ditional: both; }пример
вариантов решения море. но я бы добавил к каждой кнопке data аттрибут, в котором бы описал что делать
пример
Мне нужно, чтобы на странице была только одна кнопка, которая бы могла и открывать окна или перекидывать по ссылке.
используя эту подсказку вы можете переработать код, написанный выше, так, что он будет выполнять любое ваше желание