Показать сообщение отдельно
  #1 (permalink)  
Старый 13.07.2021, 11:48
Профессор
Отправить личное сообщение для Сергей Ракипов Посмотреть профиль Найти все сообщения от Сергей Ракипов
 
Регистрация: 01.06.2010
Сообщений: 405

Функция как в картах Гугл и Яндекс
Я не знаю как правильно называется это функция, но смысл ее заключается в том что когда зажимаешь клик на карте то карту можно перемешать в любое направление.

И вот нужно сделать так что бы фоновая картинка тоже меняла свою позицию в зависимости от того куда я ее перемещаю с помощью зажатого клика.
Возможно есть какие то готовые библиотеки или решение не такое сложное как я думаю, прошу помощи.

Возможно лучше сделать что бы картинка была не фоне а просто картинкой, я не знаю.

<!doctype html>
<html lang="ru">
<head>
	<meta charset="utf-8">
	<title>index</title>
    <style>
        body{
            font-family: 'Courier New', Courier, monospace;
            font-size: 16px;;
        }
        .blok{
            max-width: 1200px;
            margin: 0 auto;
            display:flex;
            flex-direction: column;
            align-items: center;
        }
        .podpis{
            display: block;
        }
        .fertezj{
            width: 1000px;
            height: 600px;
            background-image: url(https://rakipov.ru/files/fon3.png);
            background-repeat: no-repeat;
            background-position: center;
            cursor: crosshair;
            -webkit-box-shadow: 0px 0px 16px 6px rgba(34, 60, 80, 0.6) inset;
            -moz-box-shadow: 0px 0px 16px 6px rgba(34, 60, 80, 0.6) inset;
            box-shadow: 0px 0px 16px 6px rgba(34, 60, 80, 0.6) inset;
            border: 4px solid rgba(34, 60, 80, 0.9);
        }
    </style>
</head>

<body>
    <div class="blok">
        <p class="podpis">
            Размер блока 1000*600<br> 
            Размер фоновое изображение 2000*2000
        </p>
        <div class="fertezj"></div>
    </div>
</body>
</html>

Последний раз редактировалось Сергей Ракипов, 13.07.2021 в 11:54.
Ответить с цитированием