Страница 2 из 3 < 1 2 3 >
Показывать 40 сообщений этой темы на одной странице

Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   Менять курсор при нажатии левой кнопки мыши (https://javascript.ru/forum/dom-window/75698-menyat-kursor-pri-nazhatii-levojj-knopki-myshi.html)

Igorsrt 30.10.2018 22:14
Цитата:
Сообщение от j0hnik (Сообщение 497456) 
<style>
		div{
			width: 500px;
			height: 500px;
		}
	</style>
<div class="slider-for">слайдер</div>
	<script>

document.querySelector('.slider-for').onmousedown = e => e.target.style.cursor = 'pointer';
document.querySelector('.slider-for').onmouseup = e => e.target.style.cursor = 'default';

	</script>
благодарю!! Все просто как обычно - для тех кто знает JS ))

j0hnik 30.10.2018 22:26
Igorsrt,
<style>
	div{
		background-color: red;
		width: 500px;
		height: 500px;
	}
	div:active{
		cursor: pointer;
	}
</style>

	<div class="slider-for">слайдер</div>

усовершенствованная версия

Igorsrt 30.10.2018 22:37
Цитата:
Сообщение от j0hnik (Сообщение 497456) 
<style>
		div{
			width: 500px;
			height: 500px;
		}
	</style>
<div class="slider-for">слайдер</div>
	<script>

document.querySelector('.slider-for').onmousedown = e => e.target.style.cursor = 'pointer';
document.querySelector('.slider-for').onmouseup = e => e.target.style.cursor = 'default';

	</script>
хотя нет, не получается так... я хочу курсор grab поставить - не срабатывает.. лучше наверно, все-таки через классы css делать

SuperZen 30.10.2018 22:57
https://css-tricks.com/using-css-cur...le-header-id-1
Наведи на кнопки Happy, Sad, Meh )

Igorsrt 30.10.2018 23:07
Цитата:
Сообщение от SuperZen (Сообщение 497479)
https://css-tricks.com/using-css-cur...le-header-id-1
Наведи на кнопки Happy, Sad, Meh )
мне не нужно "наведи", мне нужно "нажми левую кнопку мышки" ))

Igorsrt 30.10.2018 23:49
Цитата:
Сообщение от Igorsrt (Сообщение 497437)
вот такой код попробовал:
jQuery('.slider-for').on({
  'mousedown': function (e) {
    jQuery(this).addClass('mouseDown');
    return false;
  },
  'mouseup': function () {
    jQuery(this).removeClass('mouseDown');
  }
});

При нажатии на кнопку - класс mouseDown добавляется, но при отпускании кнопки - почему-то пока не удаляется...:-E
в общем, в конце-концов все заработало вот с этим изначальным скриптом... Всем спасибо большое!

SuperZen 30.10.2018 23:52
еще, наверное, забыл добавить, что не отпускается тогда, когда курсор вышел за пределы элемента.

Для этого надо ставить слушатель на документ.)

Igorsrt 31.10.2018 00:13
Цитата:
Сообщение от SuperZen (Сообщение 497483)
еще, наверное, забыл добавить, что не отпускается тогда, когда курсор вышел за пределы элемента.

Для этого надо ставить слушатель на документ.)
там такая ситуация: если я нажал кнопку мышки на слайдере и нажатой перевожу курсор за его пределы (курсор при этом меняется на изначальный), потом отпускаю кнопку и обратно навожу на слайдер - то он опять как при нажатии (class="mouseDown")... это мелочи конечно - но если кто подскажет как починить, было бы супер ))

SuperZen 31.10.2018 00:17
хо-хо^^ я тебя раскусил...

Для этого надо ставить слушатель на документ.)
а это можешь, "ну или на ближайшую область"?)

j0hnik 31.10.2018 00:21 
var el = document.querySelector('.slider-for'), flag = 0;
		el.addEventListener('mousedown', e =>{
			flag = 1;
			el.style.cursor = 'pointer';
		});
		document.addEventListener('mouseup', e =>{
			flag = 0;
			el.style.cursor = 'default';
		});
		el.addEventListener('mouseout', e =>el.style.cursor = 'default');
		el.addEventListener('mouseover' ,e=>{
			if(flag) el.style.cursor = 'pointer';
		});


Часовой пояс GMT +3, время: 05:05.
Страница 2 из 3 < 1 2 3 >
Показывать 40 сообщений этой темы на одной странице