Форум

Sporium · #1 (**permalink**) 23.09.2017, 12:43

Как мне заставить двигаться изображение по классу а не по айди?

<html>
<head>
<title>HTML-документ</title>
</head>
<script language="JavaScript" type="text/javascript">
ns4 = (document.layers)? true:false
ie4 = (document.all)? true:false
 
function init() {
    if (ns4) {document.captureEvents(Event.onmousemove);}
    document.onmousemove=mousemove;
}
function mousemove(event) {
        var mouse_x = y = 0;
    if (document.attachEvent != null) {
        mouse_x = window.event.clientX;
        mouse_y = window.event.clientY;
    } else if (!document.attachEvent && document.addEventListener) {
        mouse_x = event.clientX;
        mouse_y = event.clientY;
    }
    status="x = " + mouse_x + ", y = " + mouse_y;
    document.getElementById('xy').innerHTML = "x = " + mouse_x + ", y = " + mouse_y;
   
 document.getElementById('x1').style.left = mouse_x;
  document.getElementById('x1').style.top = mouse_y;
 
}
  init()
</script>
 
<body >
<i>Internet</i>
 
<span id="xy"></span>
<br>
        <div id="x1" style="position:absolute;width:50%;height:50%;">
           <img src="1.JPG" width="189">
 <img src="2.JPG" width="189">
        </div>
</body>
</html>

laimas · #2 (**permalink**) 23.09.2017, 12:57

Сообщение от Sporium

ns4, ie4

Живее всех живых или надеетесь, что они еще живы?

Наверное обратиться по классу, там уж двигать или нет...

document.querySelector("classname")....

Sporium · #3 (**permalink**) 23.09.2017, 13:00

Я только начал учит js так что пока все очень криво и непонятно)

laimas · #4 (**permalink**) 23.09.2017, 13:41

Сообщение от Sporium

Я только начал учит js

ns4 = (document.layers) - это определение для браузера Netscape Navigator, который давно умер, более не выпускается и вряд ли есть те кто им пользуется, а если есть, то остервенелые его фанатики.

IE4, который определяется здесь ie4 = (document.all), настолько древний, что его можно даже и не учитывать. Майкрософт давно прекратил поддержку древнего IE8, который еще можно встретить у "подневольных" в сетях пользователей.

Вы просто откопали где-то очень древний код. Поищите на форуме этом, тем "про мышку и ее проделки" предостаточно и с учетом современных реалий.

Sporium · #5 (**permalink**) 23.09.2017, 13:42

Переписал (ну как переписал нашел другой вариант того что надо сделать) на это. Как сделать чтоб выбирать кликом какая картинка будет двигаться?

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <link rel="stylesheet" href="style.css">
    <script src="1.js" defer></script>
</head>
<body>
    <div class="c1"><img  onclick="function" src="1.jpg" id="cat"></div>
<img  onclick="function" src="2.jpg" id="cat2">
</body>
</html>

document.onmousemove = function (){
            document.getElementsByTagName('body')[0].insertAdjacentHTML('beforeEnd');
            var cat = document.getElementById('cat');
            cat.style.position = 'fixed';
 
            document.onmousemove = function(event){
                cat.style.left = event.clientX +20+'px';
                cat.style.top = event.clientY +20+'px';
            }
        }

рони · #6 (**permalink**) 23.09.2017, 14:06

Sporium,
https://learn.javascript.ru/drag-and-drop

Форум

Справочник

Discord чат

Курсы javascript