Форум программистов, компьютерный форум, киберфорум
JavaScript для начинающих
Войти
Регистрация
Восстановить пароль
Другие темы раздела
JavaScript Рефакторинг кода https://www.cyberforum.ru/ javascript-beginners/ thread2772526.html
Добрый день. Есть код, он работает, но проблема в том,что его много, как можно сделать рефакторинг кода.В последних 2х функция объявление и занесение одинаковое , думал сделать отдельную функцию, но...
pagespeed и отложенная загрузка изображений JavaScript
google pagespeed для сайта рекомендует настроить отложенную загрузку скрытых изображений Для этих изображений я сделал отложенную загрузку следующим образом: на картинки атрибут srс="..." ...
JavaScript Показ скрытие элементов через checkbox
Есть задача показа и скрытие блоков div по состоянию checkbox'ов, написал такую небольшую банальную функцию, но потом столкнулся с такой проблемой. Если функция toogle1 работает исправно и делает то,...
JavaScript Вывод изображения одной кнопкой в двух разных блоках Здравствуйте. Подскажите как организовать вывод изображения в двух разных блоках <div id="open_img"></div> и <div id="open_img2"></div> по координатах используя для этого одну кнопку. В коде ниже... https://www.cyberforum.ru/ javascript-beginners/ thread2772257.html
JavaScript slider next кнопка работает но prev работает 2 раза. При нажатии 3ый раз на кнопку https://www.cyberforum.ru/ javascript-beginners/ thread2772122.html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> ...
JavaScript Динамическая таблица с нумерацией ячеек
Добрый день, уважаемые знатоки подскажите как сделать добавление строк при нажатии на кнопку. В строке должно быть две ячейки, одна из которых нумеруется. А если удаляется строка, то происходит...
JavaScript Как добавить отформатированный текст в форму редактирования?
Здравствуйте! Уважаемые знатоки, подскажите пожалуйста студенту как можно вставить отформатированный текст (например: <p>привет<p/><h1>Мир</h1>) в форму. Делаю для себя сайтик на django, но он тут...
JavaScript Установить значение в разных диапазонах в зависимости от того, по какой кнопке клик. Доброе время знатоки, помогите реализовать вот такую вещь: Не могу понять, как разделить клик на две кнопки и сделать сравнение, а так же в окошке с шансом, нужно подвязать коэффициент к... https://www.cyberforum.ru/ javascript-beginners/ thread2771424.html
JavaScript Анимация создания/удаления элемента. https://www.cyberforum.ru/ javascript-beginners/ thread2771353.html
Здраствуйте, етот код создает анимацыю удаления и должен анимацию создания (не работает) обэкта, также есть баг что при быстром нажатии елементы не удаляются, помогите испраить пожалуйста, не знаю...
JavaScript JS код для замены значений в html Добрый день. Есть строка <link rel="alternate" type="application/rss+xml" title="Статьи на javascript.ru" href="/article/feed">, подскажите JS код который поменяет "/article/feed" на другое... https://www.cyberforum.ru/ javascript-beginners/ thread2771324.html
JavaScript Разработать ППП «Численное дифференцирование» различными методами https://www.cyberforum.ru/ javascript-beginners/ thread2771206.html
Разработать ППП «Численное дифференцирование» различными методами: 1) на основе интерполяционной формулы Лагранжа; 2) на основе интерполяционной формулы Ньютона; 3) по безразностным формулам...
JavaScript Изменить ширину вкладки таблицы, чтобы надпись вошла полностью Добрый день! Имеется таблица с вкладкой, надпись на которой полностью не входит. Ширина вкладки не зависит от CSS (проверил). К этой таблице есть ссылка:... https://www.cyberforum.ru/ javascript-beginners/ thread2771113.html
0 / 0 / 0
Регистрация: 30.11.2014
Сообщений: 51
0

css js свет не заходил на блоки

21.01.2021, 12:19. Просмотров 1198. Ответов 2
Метки (Все метки)


Подскажите как сделать что свет не заходил на блоки цветные сверху и снизу . Свет должен только в блоке оставаться где ландшафт и больше не где.
https://www.pvschaf.de/drohne/ind.html
PHP/HTML
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
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>drohne</title>
    <style>
        html {
            height: 100%;
 
        }
        body {
            padding: 0;
            margin: 0;
            height: 100%;
            overflow: hidden;
display: flex;
            flex-direction: column;
        }
 
        .canvas {
            width: 100%;
            height: 100%;
            background: url("Solarpark-Oberlauda.jpg") no-repeat center;
            background-size: cover;
 
        }
 
        .searchlight {
            position: absolute;
            z-index: 100;
            height: 800px;
            width: 800px;
            border-width: 100vh 100vw;
            border-style: solid;
            border-color: #000;
            top: -100vh;
            left: -100vw;
            background: #000;
            -moz-box-sizing: content-box;
            -webkit-box-sizing: content-box;
            -ms-box-sizing: content-box;
            box-sizing: content-box;
 
 
 
        }
        .searchlight.on {
            background: -moz-radial-gradient(center, ellipse cover,  rgba(0,0,0,0) 0%, rgba(0,0,0,0) 50%, rgba(0,0,0,1) 60%, rgba(0,0,0,1) 100%); /* FF3.6+ */
            background: -webkit-radial-gradient(center, ellipse cover,  rgba(0,0,0,0) 0%,rgba(0,0,0,0) 50%,rgba(0,0,0,1) 60%,rgba(0,0,0,1) 100%); /* Chrome10+,Safari5.1+ */
            background: -o-radial-gradient(center, ellipse cover,  rgba(0,0,0,0) 0%,rgba(0,0,0,0) 50%,rgba(0,0,0,1) 60%,rgba(0,0,0,1) 100%); /* Opera 12+ */
            background: -ms-radial-gradient(center, ellipse cover,  rgba(0,0,0,0) 0%,rgba(0,0,0,0) 50%,rgba(0,0,0,1) 60%,rgba(0,0,0,1) 100%); /* IE10+ */
            background: radial-gradient(ellipse at center,  rgba(0,0,0,0) 0%,rgba(0,0,0,0) 50%,rgba(0,0,0,1) 60%,rgba(0,0,0,1) 100%); /* W3C */
        }
        .center {
            display: block;
            margin: 0 auto;
 
        }
        .bild {
            display: flex;
            justify-content: center;
            align-items: center;
            height: 100%;
 
        }
        .eins {
            background-color: aqua;
            width: 100%;
            height: 200px;
 
        }
        .zwei {
            background-color: blueviolet;
            height: 200px;
 
            bottom: 0;
            width: 100%;
 
        }
    </style>
</head>
 
<body>
 
    <div class="eins"></div>
    <div class="canvas">
            <div class="bild"><img src="drohne1.png" alt="" class="center"></div>
    </div>
    <div class="zwei"></div>
<div class="searchlight"></div>
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>
    $('.searchlight')
        .on('mousemove', function(event) {
            $(this).addClass('on').css({'margin-left': event.pageX - 400, 'margin-top': event.pageY - 400});
        })
        .on('mouseout', function(event) {
            $(this).removeClass('on');
        })
 
</script>
</body>
</html>


Вернуться к обсуждению:
css js свет не заходил на блоки
0
Лучшие ответы (1)
Programming
Эксперт
94731 / 64177 / 26122
Регистрация: 12.04.2006
Сообщений: 116,782
21.01.2021, 12:19
Готовые ответы и решения:

CSS Задание CSS блоки
Создайте страницу

Блоки css
krabo.ru/index.php?route=product/category&amp;path=88 Я чайник, поэтому не знаю как правильно это...

Блоки CSS
Есть код, который делает три блока как на 1 скрине, при добавлении текста в левый блок(1) , 2 и 3...

блоки в css
Здравствйте ребята. Подскажите пожалуйста, какую команду прописать, чтобы блоки при перемещние не...

__________________
Помогаю в написании курсовых работ и дипломов здесь.
2
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin® Version 3.8.9
Copyright ©2000 - 2021, vBulletin Solutions, Inc.