FlipImage
等级: 初级
对于网页开发者来说,了解操纵图像的基本知识是很重要的,因为丰富的网页应用程序依赖于图像为用户界面和用户体验(UI/UX)增添价值。
FlipImage 探索了图像操纵的一个方面 - 图像旋转。该应用展示了一个包含单个图像的方形窗格,以 2x2 矩阵形式呈现。使用位于每个图像旁边的上、下、左、右箭头,用户可以垂直或水平翻转它们。
您只能使用原生 HTML、CSS 和 Javascript 来实现这个应用。不允许使用图像包和库。
用户故事
- [ ] 用户可以看到一个以 2x2 矩阵重复显示单个图像的窗格
- [ ] 用户可以使用位于图像旁边的上、下、左、右箭头垂直或水平翻转其中的任何一个图像
额外功能
- [ ] 用户可以通过在输入字段中输入不同图像的 URL 来更改默认图像
- [ ] 用户可以通过点击输入字段旁边的 '显示' 按钮来显示新图像
- [ ] 如果新图像的 URL 未找到,用户会看到错误消息