README

Example Guide

贡献指南

▼ 项目列表

▼ Intermediate-Level Ideas

Book Finder App

To-Do 应用

命令行计算器

Markdown预览器

Emoji翻译器应用

Password Generator

Name Generator

Meme生成器应用

FlashCards应用

Charity Finder App

Podcast目录应用

Game Suggestion App

Simple Online Store

Flip Art App

HighStriker游戏

Sports Bracket Generator

时区提醒机器人

二维码徽章应用

卡片记忆游戏

Bit Masks App

Chrome主题扩展

Currency Converter

Drawing App

GitHub个人资料

Image Scanner

Markdown表格生成器

RegExp助手应用

Sales数据库应用程序

String Art

This or That Game

Typing Practice App

Voting App

Math Editor

▼ 初学者项目合集

Bin2Dec应用

Border Radius Previewer

CSV转JSON应用

Calculator App

Calendar App

因果应用

Christmas Lights App

Color Cycle App

倒计时器应用

Dollars To Cents App

Dynamic CSS Variables App

First Database App

Flip Image App

GitHub状态应用

Hello App

IOT邮箱应用

JSON转CSV应用

Javascript正则表达式验证

Key-Value 应用

Lorem Ipsum 生成器

Notes应用

Pearson回归应用

Pomodoro时钟

产品登陆页

Quiz应用程序

随机餐点生成器

随机数生成器

Recipe App

Roman to Decimal Converter

滑块设计

Stopwatch App

True or False App

Vigenere 密码

Weather App

Windchill App

Word Frequency App

▼ Advanced Ideas

Battleship Bot

Battleship游戏引擎

Boole Bot 游戏

Bug Race Game

Calorie Counter App

Chat应用

Contribution Tracker App

Elevator App

FastFood应用

GitHub时间线应用

GitTweet应用

Instagram克隆应用

Kudos Slackbot

Movie App

MyPodcast Library App

NASA系外行星查询

Shell Game

Shuffle-Deck-App

Slack 归档器

SpellIt-App

Survey App

字符画

等级: 中级

字符串艺术的目的在于提供给开发者练习创建一个简单的动画图形,在动画算法中使用几何图形,并创造视觉上令人愉悦的观看体验。

字符串艺术绘制一条多色线条,该线条平滑地移动,直到一端触及包围窗口的边缘。在触及时应用反弹效果以改变其方向。

通过仅在线条移动时保留10-20张图片来创建涟漪效果。较旧的图像逐渐淡出,直到消失。

不允许使用动画库。仅使用原生HTML/CSS/JavaScript。

用户故事

  • [ ] 从随机位置开始,在包围窗口的边界内绘制一条多色线条
  • [ ] 每20毫秒根据轨迹(基于端点的增量距离)绘制一条新线
  • [ ] 当线条的任一端触及包围窗口的边界时,改变方向并随机更改角度
  • [ ] 渐渐淡出旧线的强度,以便只有最近的10-20条线条可见,从而产生移动感或“涟漪”

额外功能

  • [ ] 用户可以指定线条的长度和速度
  • [ ] 用户可以指定窗口内的多条线条,所有线条都沿着不同的轨迹和速度移动

有用的链接和资源

示例项目

这个项目非常接近,但有一个小包围窗口且是单色的。 Daniel Cortes