Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 15.08.2019, 20:27
Интересующийся
Отправить личное сообщение для Андрей812 Посмотреть профиль Найти все сообщения от Андрей812
 
Регистрация: 10.09.2018
Сообщений: 16

mousedown - HELP
Подскажите, как сделать чтобы при удержании левой кнопки мыши не происходил клик по ссылки. А если кликнуть по ссылке был переход.
<!DOCTYPE html >
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<title>Скроллинг мышью</title>
<style type="text/css">
.scroll 
{   position:absolute;
    top:10px;
    left:100px;
	height: 100px;
	overflow-x: auto;
	width: 200px;
       cursor: all-scroll;
}
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<script type="text/javascript">
    window.onload = function () {
        var scr = $(".scroll");
        scr.mousedown(function () {
            var startX = this.scrollLeft + event.pageX;
            var startY = this.scrollTop + event.pageY;
            scr.mousemove(function () {
                this.scrollLeft = startX - event.pageX;
                this.scrollTop = startY - event.pageY;
                return false;
            });
        });
        $(window).mouseup(function () {
            scr.off("mousemove"); 
        });
    }
</script>

</head>
<body>
<div class="scroll">
  <a href="#"><img src="1.jpg"/></a>
  <a href="#"><img src="2.jpg"/></a>
</div>
</body>
</html>
Ответить с цитированием
  #2 (permalink)  
Старый 15.08.2019, 21:23
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 26,518

Андрей812,
scr.mousedown(function (event) {
            if(event.which == 3) {
                 event.stopPropagation();
                 //....
            }
Ответить с цитированием
  #3 (permalink)  
Старый 16.08.2019, 00:08
Интересующийся
Отправить личное сообщение для Андрей812 Посмотреть профиль Найти все сообщения от Андрей812
 
Регистрация: 10.09.2018
Сообщений: 16

Перестало работать перемещение картинок удержанием левой кнопки мыши

<!DOCTYPE html >
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<title>Скроллинг мышью</title>
<style type="text/css">
.scroll 
{   position:absolute;
    top:10px;
    left:100px;
	height: 100px;
	overflow-x: auto;
	width: 200px;
       cursor: all-scroll;
}
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<script type="text/javascript">
    window.onload = function () {
        var scr = $(".scroll");
        scr.mousedown(function (event) {
	    if(event.which == 3) {
            event.stopPropagation();
            var startX = this.scrollLeft + event.pageX;
            var startY = this.scrollTop + event.pageY;
            scr.mousemove(function () {
                this.scrollLeft = startX - event.pageX;
                this.scrollTop = startY - event.pageY;
                return false;
            });
           }
        });
        $(window).mouseup(function () {
            scr.off("mousemove"); 
        });
    }
</script>

</head>
<body>
<div class="scroll">
  <a href="#"><img src="https://emn178.github.io/jquery-lazyload-any/samples/images/images/batman.png"/></a>
  <a href="#"><img src="https://emn178.github.io/jquery-lazyload-any/samples/images/images/batman.png"/></a>
</div>
</body>
</html>

Последний раз редактировалось Андрей812, 16.08.2019 в 00:12.
Ответить с цитированием
  #4 (permalink)  
Старый 16.08.2019, 00:45
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 26,518

Андрей812,
левую с правой спутал
Ответить с цитированием
  #5 (permalink)  
Старый 16.08.2019, 01:00
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 26,518

Андрей812,
<!DOCTYPE html >
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<title>Скроллинг мышью</title>
<style type="text/css">
.scroll
{   position:absolute;
    top:10px;
    left:100px;
	height: 100px;
	overflow-x: auto;
	width: 200px;
    cursor: all-scroll;
}

body{
    position: relative;
}

</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<script type="text/javascript">
    window.onload = function () {
        var scr = $(".scroll"), move;
        scr.mousedown(function (event) {
            window.setTimeout(function() {
               move = true;
            },250);
            var startX = this.scrollLeft + event.pageX;
            var startY = this.scrollTop + event.pageY;
            scr.mousemove(function (event) {
                event.preventDefault();
                this.scrollLeft = startX - event.pageX;
                this.scrollTop = startY - event.pageY;
            });

        });
        scr.click(function(event) {
              if(move) {
               event.preventDefault();
              };
            });

        $(window).mouseup(function () {
            scr.off("mousemove");
            window.setTimeout(function() {
               move = false;
            },50);
        });

    }
</script>

</head>
<body>
<div class="scroll">
  <a href="https://yandex.ru/"><img src="https://emn178.github.io/jquery-lazyload-any/samples/images/images/batman.png"/></a>
  <a href="https://yandex.ru/"><img src="https://emn178.github.io/jquery-lazyload-any/samples/images/images/batman.png"/></a>
</div>
</body>
</html>
Ответить с цитированием
  #6 (permalink)  
Старый 16.08.2019, 12:28
Интересующийся
Отправить личное сообщение для Андрей812 Посмотреть профиль Найти все сообщения от Андрей812
 
Регистрация: 10.09.2018
Сообщений: 16

СПАСИБО!!!
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как повесить обработчик mousedown на datepicker input-а? gait Events/DOM/Window 3 10.05.2013 13:09
mousedown - это событие чего? jsuse Общие вопросы Javascript 3 15.11.2011 21:17
Цепная обработка события MouseDown с использованием jQuery gifer Events/DOM/Window 0 18.02.2011 15:55
конфликт в событиях mousedown и click MainBuh Firefox/Mozilla 3 06.08.2010 08:39