Форум программистов, компьютерный форум, киберфорум
JavaScript
Войти
Регистрация
Восстановить пароль
 
Рейтинг 4.78/9: Рейтинг темы: голосов - 9, средняя оценка - 4.78
0 / 0 / 0
Регистрация: 15.07.2017
Сообщений: 99
1

Узнать растояние от начала блока до курсора мыши

09.05.2018, 12:07. Показов 1720. Ответов 2
Метки нет (Все метки)

Ситуация такая, есть видео плеер, весь контроль написан с нуля, и дело в том что когда на progress bar, когда мы хотим преремотать видео он отсчитыает растояние от левого начала экрана и до мыши и даёт ширину прогресс бару равную этой ширине, это хорошо когда видео открыто на фул скрин, а когда открыто в небольшом окне как на скриншоте нужно отсчитать длинну от начала контейнера с видео до мыши в момент клика, как это с делать может кто нибудь примерно подскажет ? Буду очень благодарен. Вот скриншот:
Узнать растояние от начала блока до курсора мыши
0
Лучшие ответы (1)
Programming
Эксперт
94731 / 64177 / 26122
Регистрация: 12.04.2006
Сообщений: 116,782
09.05.2018, 12:07
Ответы с готовыми решениями:

Как узнать координаты курсора мыши
Как узнать положение курсора мыши на страницу?

Как узнать статус курсора мыши?
Кто может конкретно ответить? Как получить статус(что-то типа в этом роде) курсора, который...

Почему фон блока смещается при наведении курсора мыши и клике?
Есть div, добавляю ему фон через css. Если div растянут на всю ширину экрана, все нормально. Но...

Как узнать координаты курсора мыши и отобразить их? c++
Как узнать координаты курсора мыши и отобразить их? c++

2
Модератор
Эксперт JSЭксперт HTML/CSS
3613 / 2528 / 1489
Регистрация: 12.07.2015
Сообщений: 6,481
Записей в блоге: 4
09.05.2018, 13:06 2
Лучший ответ Сообщение было отмечено stoma655 как решение

Решение

Изображения и любые другие файлы загружайте на форум (Правила п.4.11)

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
<!DOCTYPE html>
<html lang="en">
 
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>Document</title>
  <style>
    #progress {      
      height: 10px;
      border: 1px solid black;
      box-sizing: border-box;
      position: relative;
    }
 
    #fill {
      position: absolute;
      top: 0;
      left: 0;
      bottom: 0;
      background-color: red;
    }
  </style>
</head>
 
<body>
  <div id="progress">
    <div id="fill"></div>
  </div>
 
  <script>
    var progress = document.getElementById("progress");
    var fill = document.getElementById("fill");
    progress.onclick = function(e) {
      fill.style.width = e.clientX - progress.offsetLeft + 'px';
    };
  </script>
</body>
 
</html>
1
0 / 0 / 0
Регистрация: 15.07.2017
Сообщений: 99
09.05.2018, 14:21  [ТС] 3
Спасибо тебе огромное!! на счет изображений усвоил )
0
IT_Exp
Эксперт
87844 / 49110 / 22898
Регистрация: 17.06.2006
Сообщений: 92,604
09.05.2018, 14:21

Заказываю контрольные, курсовые, дипломные работы и диссертации здесь.

Как узнать координаты курсора мыши относительно формы?
Как узнать координаты курсора мыши? Добавлено через 35 минут относительно окна нужно

Как изменить цвет курсора ввода и курсора мыши в элементе Edit
Всем Здравия. Проблема в следующем, задал цвет фона и цвет текста в Edit, тут все нормально, но...

Chart как показывать координаты мыши по графику возле курсора мыши!
Chart как показывать координаты мыши по графику возле курсора мыши! Когда двигаешь мышкой по...

Вывод и удаление символа в координатах курсора мыши при нажатии на кнопки мыши
У меня есть вот такая задача: ПРи нажатии правой кнопки мыши обеспечить вывод на монитор по...


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

Или воспользуйтесь поиском по форуму:
3
Ответ Создать тему
Опции темы

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