Does anyone know how to move an image with css

Question

please write the code in answer

Answer 1

You could use

img:hover {
transform: translate(100px, 200px)
}

or

img {
transition: left 2s;
transition: top 2s;
}

img:hover {
position: absolut;
left: 100px;
top: 200px;
}

But they only move as long as you hover over the image. To permanetly move a image you need some javascript. You can use a CSS class

.move-img {
position: absolute:
left: 100px;
}

and add this class dynamically to your image using JS.

<script>
function moveImage() {
var image = document.getElementById('yourImg');
image.className += 'move-img';
}
</script>

Now you can call this function on a button click for example.

<button onclick="moveImage()">Move img</button>

Answer 2

thnx