Форум программистов, компьютерный форум, киберфорум
HTML, CSS
Войти
Регистрация
Восстановить пароль
Блоги Сообщество Поиск Заказать работу  
 
1 / 1 / 0
Регистрация: 15.03.2019
Сообщений: 189

Активная кнопка над виидео

09.02.2025, 22:26. Показов 1222. Ответов 1

Студворк — интернет-сервис помощи студентам
Всем привет
есть блок с видео и кнопкой

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
<div class="video">
        <h1 class="video_text">Здесь нужно вставить Видео</h1>
        <iframe width="100%" height="860" src="https://www.youtube.com/embed/aVx61-n5awQ"
          title="Как создают ЧИТЫ для ОНЛАЙН ИГР?" frameborder="0"
          allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share"
          referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
        <div class="button_osnov btnz">
          <div class="video_button button">
            <p>Связаться с нами</p>
          </div>
        </div>
<style>
.video {
  position: relative;
  z-index: 0;
 
  
}
 
.video iframe {
  border-radius: 4px;
  /* border-radius: 50%; */
  /* border-bottom: 125px solid; */
}
 
.video_text {
  position: absolute;
  top: 67px;
  left: 69px;
  font-family: 'title', sans-serif;
  font-size: 80px;
  font-weight: 500;
  line-height: 96px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
 
.video_button {
  position: relative;
  width: 336px;
  bottom: -0px;
  right: 27px;
  background-color: transparent;
  border-bottom: 92px solid #B21F24;
  border-left: 26px solid transparent;
  height: 92px;
 
}
 
.button_osnov {
  width: 347px;
  height: 128px;
  display: block;
  position: absolute;
  right: 0px;
  bottom: 0px;
  border-bottom: 128px solid #fff;
  border-left: 37px solid transparent;
}
</style>
самое что интересное кнопка та видна, но на нее не возможно нажать, следовательно можно какой-то крутой border сделать у видео, или кнопки на уровень выше поднять, но чтоб кнопка была активна
0
Programming
Эксперт
39485 / 9562 / 3019
Регистрация: 12.04.2006
Сообщений: 41,671
Блог
09.02.2025, 22:26
Ответы с готовыми решениями:

Активная/неактивная кнопка
На страничке две кнопки. При нажатии на одну кнопку(заблокировать/разблокировать) необходимо что бы вторая кнопка стала неактивной, а после...

Активная кнопка на баннере
Добрый день, на данном сайте ссылка(не реклама). На банерах есть кнопка, и она меняется в зависимости от баннера, подскажите как такое...

Активная кнопка меню
Добрый день. Есть горизонтальное меню, пытаюсь сделать так, чтобы кнопка активного пункта меню отличалась от неактивного, причем каждая из...

1
 Аватар для Mailo
178 / 226 / 31
Регистрация: 18.02.2010
Сообщений: 2,313
09.02.2025, 22:49
CSS
1
2
3
.button_osnov {
  z-index: 1;
}
0
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
inter-admin
Эксперт
29715 / 6470 / 2152
Регистрация: 06.03.2009
Сообщений: 28,500
Блог
09.02.2025, 22:49
Помогаю со студенческими работами здесь

Полоса прокрутки появляется но она не активна
В общем создан макет из таблиц.Внизу кода есть ячейка в которой должна появляться полоса прокрутки но она тянется вниз(отмечу тегам...

Галочка в форме если активна появляются еще два поля
Есть html форма &lt;form onsubmit=&quot;return send_request(this);&quot;&gt; &lt;input type=&quot;hidden&quot; name=&quot;what&quot;...

Как изменить размер и месторасположение кнопки и шрифт текста в кнопк?
есть кнопка: &lt;input value=&quot;Как получить задания и ответы&quot; type=&quot;button&quot; onclick=&quot;location.href='otv.html'&quot; /&gt; нужно: ...

Не активна горизонтальная полоса прокрутки
Хочу сделать возможность просматривать пдф файлы на сайте. Есть canvas, который отрисовывает pdf и div с элементами меню, который поверх...

Кнопка на bootstrap'e
Есть слайдер.На слайде заголовок и абзац с кнопкой,и изображение.На обычном мониторе все хорошо,но на моб.экранах кнопка...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
2
Ответ Создать тему
Новые блоги и статьи
Конвертировать закладки radiotray-ng в m3u-плейлист
damix 19.02.2026
Это можно сделать скриптом для PowerShell. Использование . \СonvertRadiotrayToM3U. ps1 <path_to_bookmarks. json> Рядом с файлом bookmarks. json появится файл bookmarks. m3u с результатом. # Check if. . .
Семь CDC на одном интерфейсе: 5 U[S]ARTов, 1 CAN и 1 SSI
Eddy_Em 18.02.2026
Постепенно допиливаю свою "многоинтерфейсную плату". Выглядит вот так: https:/ / www. cyberforum. ru/ blog_attachment. php?attachmentid=11617&stc=1&d=1771445347 Основана на STM32F303RBT6. На борту пять. . .
Символьное дифференцирование
igorrr37 13.02.2026
/ * Программа принимает математическое выражение в виде строки и выдаёт его производную в виде строки и вычисляет значение производной при заданном х Логарифм записывается как: (x-2)log(x^2+2) -. . .
Камера Toupcam IUA500KMA
Eddy_Em 12.02.2026
Т. к. у всяких "хикроботов" слишком уж мелкий пиксель, для подсмотра в ESPriF они вообще плохо годятся: уже 14 величину можно рассмотреть еле-еле лишь на экспозициях под 3 секунды (а то и больше),. . .
И ясному Солнцу
zbw 12.02.2026
И ясному Солнцу, и светлой Луне. В мире покоя нет и люди не могут жить в тишине. А жить им немного лет.
«Знание-Сила»
zbw 12.02.2026
«Знание-Сила» «Время-Деньги» «Деньги -Пуля»
SDL3 для Web (WebAssembly): Подключение Box2D v3, физика и отрисовка коллайдеров
8Observer8 12.02.2026
Содержание блога Box2D - это библиотека для 2D физики для анимаций и игр. С её помощью можно определять были ли коллизии между конкретными объектами и вызывать обработчики событий столкновения. . . .
SDL3 для Web (WebAssembly): Загрузка PNG с прозрачным фоном с помощью SDL_LoadPNG (без SDL3_image)
8Observer8 11.02.2026
Содержание блога Библиотека SDL3 содержит встроенные инструменты для базовой работы с изображениями - без использования библиотеки SDL3_image. Пошагово создадим проект для загрузки изображения. . .
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2026, CyberForum.ru