Axure如何制作密码框隐藏与显示效果

2024-11-06 10:09:27

1、打开Axure,准备一个【文本框】命名password,一个【眼睛logo】。如图

Axure如何制作密码框隐藏与显示效果

2、复制【password】文本框,生成【password1】,位置同password文本框一样,然后将password1文本框放置在【底层】。如图

Axure如何制作密码框隐藏与显示效果

3、选择【password】文本框,设置文本框类型为【密码】类型。这样在password文本框输入密码时显示的就不是明文了。如图

Axure如何制作密码框隐藏与显示效果

4、设置眼薜殷衙疝睛logo的【鼠标移入时】事件:将文本框password1置于顶层,然后设置password1文本框的值等于password文本框的值,如图

Axure如何制作密码框隐藏与显示效果

5、设置眼睛logo的【鼠标移出时】事件:将文本框password1置于底层即可,如图

Axure如何制作密码框隐藏与显示效果

6、完成设置后,预览结果,在输入时显示隐藏文字,查点眼睛logo显示密码明文。如图

Axure如何制作密码框隐藏与显示效果Axure如何制作密码框隐藏与显示效果
猜你喜欢