こんにちは、私はプログラミングの初心者です。Web ページで画像を上下にドラッグするときに、画像のサイズを変更したいですか?
上にドラッグするとサイズが小さくなり、下にドラッグするとサイズが大きくなります。アニメーションでサイズを変更できるようになりました。ドラッグするとサイズが変更されます。これがコードです
<!DOCTYPE html>
<html>
<head>
<style>
div.hidden
{
width:20px;
height:80px;
background:white;
position:relative;
overflow:hidden;
left:50px;
top:400px;
-webkit-animation-timing-function:linear;
-webkit-animation:myfirst 5s ;
}
@-webkit-keyframes myfirst /* Safari and Chrome */
{
from {background:white; height:0px;width:0;left:50px; top:40px; }
to {background:white; height:80px;width:20px;left:50px; top:430px;}
}
</style>
</head>
<body background="road.jpg">
<div style="position:relative;width:126px;height:350px; overflow:hidden; border: solid 1px;left:639px;top:307px;">
<div class="hidden";></div>
</div>
To: <input type="text" name ="To"><br><br>
</body>
</html>