利用javascript做的一个用户可自定义输入框的登陆页面

本文链接：https://blog.youkuaiyun.com/Pazza_Infer/article/details/6386937

本文介绍了一段使用JavaScript编写的代码，该代码实现了一个允许用户自行调整输入框位置和大小的登录页面。通过监听鼠标事件，动态创建并调整文本框的位置和尺寸，为用户提供了一个可交互的登录界面体验。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

前段时间前辈让做js练习，写一个能让用户自己控制输入框位置大小的登陆页面，于是有了这段代码:

<html> <head> <title>用户可自定义输入框的登陆界面</title> <mce:style type="text/css"></mce:style><style type="text/css" mce_bogus="1">body { margin-left: 0px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; }</style> <mce:script language="javascript"></mce:script> </head> <body> <div align="center" style="vertical-align: top;width:100%;height:95%;background-image:url(1.jpg);background-repeat:x-repeat" οnmοusemοve="drawline()" οnmοusedοwn="My_clientx(event)" οnmοuseup="My_clienty(event)"> <form action="" method="post"> <div align="center" id="div1" style="vertical-align: top;filter:alpha(Opacity=50);position:absolute;left:0px;top:0px;border:0px;width:0px;height:0px;z-index:1;background:#ccc"> </div> <div align="center" id="div2" style="vertical-align: top;filter:alpha(Opacity=50);position:absolute;left:0px;top:0px;border:0px;width:0px;height:0px;z-index:1;background:#ccc"> </div> <input type="submit" value="登陆"/> </form> </div><input type="button" value="重画" οnclick="del()"/> </body> </html>