Вход
Быстрая регистрация
Если вы у нас впервые: О проекте FAQ
0

Как сделать на js+html, чтобы после нажатия на баннер, отображалась кнопка?

mastermiha [20.2K] 2 месяца назад

На одном из сайтов у меня было реализовано так, что после нажатия на ссылку(она открывалась в другом окне браузера), появлялась кнопка для продолжения операции, с обычными ссылками эта JS-функция (hidetxt) работает нормально, какие ссылки я бы не поместил в этом блоке:

<object onclick="hidetxt('re­kblock'); ">

ссылки

</object>

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

не появляется кнопка при нажатии на баннер

Как исправить Javascript-функцию hidetxt, чтобы кнопка появлялась и при нажатии на баннер?

P.S. Баннеры выводятся через Javascript с другого ресурса, как и ссылки.

1

Доброго времени суток. Такое свойство принято называть спойлером.

Моё мнение о JavaScript

JavaScript - это зло и ничего больше. Через него мы можем хозяйничать на компьютере клиента, без его ведома управлять окнами, загружать файлы и многое другое. Помимо всех дырок в безопасности (а их миллионы) даже простейшая функция document.write() даёт неслабую нагрузку на ЭВМ пользователя.

Я предложу Вам вариант как на чистом CSS, так и на JS. Если я Вас переубедил - воспользуйтесь первым способом.

Способ 1. HTML+CSS

HTML:

<! DOCTYPE HTML >

<html>

<head>

<meta charset="UTF-8" />

<title>Example</titl­e>

</head>

<body>

<div class="spoiler">

Нажми на меня!

<div class="spoiler-conte­nt">$СОДЕРЖИМОЕ$</div­>

</div>

</body>

</html>

CSS:

.spoiler-content { display: none; }

.spoiler:active .spoiler-content { display: block; }

.spoiler-content:ho­ver { display: block; }

**Способ 2. HTML+CSS+JavaScript*­*

HTML:

<! DOCTYPE HTML >

<html>

<head>

<meta charset="UTF-8" />

<title>Example</titl­e>

</head>

<body>

<a href="#" class="spoiler"><spa­n>Нажми на меня!</span></a>

<div class="spoiler-conte­nt">$СОДЕРЖИМОЕ$</div­>

</body>

</html>

CSS:

spoiler-content { display: none; }

JavaScript:

$(document).on('clic­k', '.spoiler', function(e) {

e.preventDefault();

$(this).toggleClass(­'active');

$(this).parent().fin­d('.spoiler-content')­.first().slideToggle(­300);

});

Знаете ответ?
Есть интересный вопрос? Задайте его нашему сообществу, у нас наверняка найдется ответ!
Делитесь опытом и знаниями, зарабатывайте награды и репутацию, заводите новых интересных друзей!
Задавайте интересные вопросы, давайте качественные ответы и зарабатывайте деньги. Подробнее..
регистрация
OpenID