Skip to content

LiZhongpeng2/pic_filter

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

4 Commits
 
 
 
 
 
 
 
 

Repository files navigation

🌈 图片滤镜处理工具

🎨 一个基于原生JavaScript的图片处理网页应用

👨‍💻 这是我学习JavaScript过程中的实战项目

🚀 项目介绍

这是一个纯前端项目,使用原生JavaScript实现图片滤镜处理功能。通过这个项目,我学习了很多JavaScript的核心概念和DOM操作技巧。

🎯 主要功能

  • 📸 图片上传(支持拖拽上传) 🎨 基础调整
  • 亮度调节
  • 对比度调节
  • 饱和度调节 ✨ 特效滤镜
  • 黑白效果
  • 复古效果
  • 模糊效果
  • 锐化效果 🔄 图片变换
  • 左右旋转
  • 水平翻转
  • 垂直翻转 💾 图片保存

💡 学习收获

通过这个项目,我学习了以下JavaScript知识点:

  1. DOM操作
  • 元素选择与操作
  • 事件监听与处理
  • 样式动态修改
  1. 文件处理
  • FileReader API的使用
  • Drag & Drop API
  • Blob与Data URL
  1. 图片处理
  • Canvas API
  • CSS滤镜效果
  • 图片转换与下载
  1. ES6特性
  • 箭头函数
  • 解构赋值
  • 模板字符串

🛠️ 技术栈

  • HTML5 CSS3 JavaScript (ES6+)

🤝 欢迎交流

我是一名正在学习JavaScript的学生,如果你:

  • 发现了代码中的问题
  • 有更好的实现方式
  • 想要交流学习经验

欢迎联系我!

📚 学习资源

在学习过程中,我参考了以下资源:

  • MDN Web文档
  • JavaScript.info
  • 各种技术博客

🔜 未来计划

  • 添加更多滤镜效果
  • 优化性能
  • 添加撤销/重做功能
  • 支持批量处理

🌟 如果这个项目对你有帮助,欢迎star!

💪 一起学习,一起进步!

About

This is a small example of me practicing JS :)

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages