# webProject

**Repository Path**: liyongdada/webProject

## Basic Information

- **Project Name**: webProject
- **Description**: JS学习DEMO，全原生实现
- **Primary Language**: JavaScript
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 1
- **Forks**: 0
- **Created**: 2021-06-04
- **Last Updated**: 2022-08-11

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# webProject
这个项目是我在学校学习的时候写的一些小demo,很多还有更好的写法，这里就当仅提供一些思路，抛砖引玉吧，欢迎您提出更好的建议共同讨论，谢谢！
### 图片特效系列<br>
1、[模仿网易去音乐实现3D效果图片轮播](http://htmlpreview.github.io/?https://github.com/YUUXIAO/webProject/blob/master/Images/3DchangImg/index.html)<br>
2、[模仿小米手机视觉差产品图片展示](http://htmlpreview.github.io/?https://github.com/YUUXIAO/webProject/blob/master/Images/M4image/%E5%9B%BE%E7%89%87%E4%BA%A7%E5%93%81%E5%B1%95%E7%A4%BA.html)<br>
3、[淡入淡出式轮播图](http://htmlpreview.github.io/?https://github.com/YUUXIAO/webProject/blob/master/Images/opacityCarousel/index.html)<br>
4、[点出左右按钮图片组切换轮播图](http://htmlpreview.github.io/?https://github.com/YUUXIAO/webProject/blob/master/Images/imglistChange/index.html)<br>
5、[百页窗效果轮播图](http://htmlpreview.github.io/?https://github.com/YUUXIAO/webProject/blob/master/Images/carousel/index.html)<br>
6、[模拟相册效果可点击放大左右切换](http://htmlpreview.github.io/?https://github.com/YUUXIAO/webProject/blob/master/Images/ablum/index.html)<br>
7、[CSS3实现广告轮播器](http://htmlpreview.github.io/?https://github.com/YUUXIAO/webProject/blob/master/Images/adImages/css3%E5%88%B6%E4%BD%9C%E5%B9%BF%E5%91%8A%E8%BD%AE%E6%92%AD.html)<br>
8、[实现电商网站放大镜效果](http://htmlpreview.github.io/?https://github.com/YUUXIAO/webProject/blob/master/Images/bigIamge/%E6%94%BE%E5%A4%A7%E9%95%9C%E6%95%88%E6%9E%9C.html)<br>
9、[实现鼠标滑过文字信息动态出现](http://htmlpreview.github.io/?https://github.com/YUUXIAO/webProject/blob/master/Images/hoveInfo/%E9%BC%A0%E6%A0%87%E6%BB%91%E5%8A%A8%E6%96%87%E5%AD%97%E5%8A%A8%E6%80%81%E6%95%88%E6%9E%9C.html)<br>
10、[CSS3实现鼠标滑过动态显示信息](http://htmlpreview.github.io/?https://github.com/YUUXIAO/webProject/blob/master/Images/hoverInfo/index.html)<br>
11、[数组方法实现图片随机打乱和顺序排序](http://htmlpreview.github.io/?https://github.com/YUUXIAO/webProject/blob/master/Images/randomImages/index.html)<br>
12、[鼠标滑过旋转显示图片信息](http://htmlpreview.github.io/?https://github.com/YUUXIAO/webProject/blob/master/Images/rotateImg/1.html)<br>
### 菜单按钮系列<br>
1、[实现扇形旋转飞进飞出菜单栏](http://htmlpreview.github.io/?https://github.com/YUUXIAO/webProject/blob/master/Menu/Sector%20navigation/index.html)<br>
2、[CSS3实现Google动感菜单](https://rawgit.com/YUUXIAO/webProject/master/Menu/googleMenu/css3%E4%BB%BFGoogle.html)<br>
3、[实现苹果任务栏菜单](http://htmlpreview.github.io/?https://github.com/YUUXIAO/webProject/blob/master/Menu/iphone/%E4%BB%BF%E8%8B%B9%E6%9E%9C%E7%94%B5%E8%84%91%E4%BB%BB%E5%8A%A1%E6%A0%8F%E8%8F%9C%E5%8D%95.html)<br>
4、[CSS3实现动感光影垂直菜单栏](https://rawgit.com/YUUXIAO/webProject/master/Menu/moveMenu/index.html)<br>
5、[动感实现伸缩显示二级菜单](https://rawgit.com/YUUXIAO/webProject/master/Menu/verticalSecondmenu/index.html)<br>
6、[平形四边形中英文切换菜单栏](https://rawgit.com/YUUXIAO/webProject/master/Menu/language.html)<br>
7、[鼠标滑过旋转显示二级菜单栏](https://rawgit.com/YUUXIAO/webProject/master/Menu/rotatemenu.html)<br>
8、[页面滚动到一定高度显示悬浮菜单](https://rawgit.com/YUUXIAO/webProject/master/Menu/scrollTopMENU.html)<br>
9、[回到顶部按钮--缓冲效果](https://rawgit.com/YUUXIAO/webProject/master/Menu/scrollTop/index.html)<br>
10、[水波按钮](https://rawgit.com/YUUXIAO/webProject/master/Menu/button/ripple.html)<br>
11、[幽灵按钮](https://rawgit.com/YUUXIAO/webProject/master/Menu/button/index.html)<br>
12、[CSS3实现按钮温柔闪光灯效果](https://rawgit.com/YUUXIAO/webProject/master/Menu/button/btn2.html)<br>
### 其它<br>
1、[DOM实现鼠标滑过右边动态显示详细信息](https://rawgit.com/YUUXIAO/webProject/master/changeInfo/info.html)<br>
2、[实现复选框全选、全不选和反选功能](https://rawgit.com/YUUXIAO/webProject/master/checkboxChoose/index.html)<br>
3、[CSS3实现钟表可走动](https://rawgit.com/YUUXIAO/webProject/master/clocks/index.html)<br>
4、[DOM实现拖拽购物车结账功能](https://rawgit.com/YUUXIAO/webProject/master/dragShoppingcar/index.html)<br>
5、[实现抽屉式效果图片展示](https://rawgit.com/YUUXIAO/webProject/master/drawerImg/index.html)<br>
6、[鼠标滑过内容动态展开详细信息](https://rawgit.com/YUUXIAO/webProject/master/hoverInfo/index%20-%20%E5%89%AF%E6%9C%AC.html)<br>
7、[键盘控制小球移动](https://rawgit.com/YUUXIAO/webProject/master/keyScrollball/index.html)<br>
8、[CSS3绘画macBook](https://rawgit.com/YUUXIAO/webProject/master/macbook/index.html)<br>
9、[消除表情小游戏](https://rawgit.com/YUUXIAO/webProject/master/clearemotionsGame/index.html)<br>
10、[DOM实现留言板功能](https://rawgit.com/YUUXIAO/webProject/master/messageBoard/index.html)<br>
11、[canvas实现鼠标画图功能](https://rawgit.com/YUUXIAO/webProject/master/mouseDraw/index.html)<br>
12、[点出显示弹出框居中可移动](https://rawgit.com/YUUXIAO/webProject/master/moveAlert/%E5%BC%B9%E5%87%BA%E6%A1%86%E5%8F%AF%E7%A7%BB%E5%8A%A8.html)<br>
13、[实现电脑桌面图标移动拖拽功能](https://rawgit.com/YUUXIAO/webProject/master/moveIcon/index.html)<br>
14、[随鼠标移动效果--按轨迹移动](https://rawgit.com/YUUXIAO/webProject/master/moveLoad/%E7%A7%BB%E5%8A%A8%E6%95%88%E6%9E%9C%EF%BC%88%E6%8C%89%E8%BD%A8%E8%BF%B9%E7%A7%BB%E5%8A%A8%EF%BC%89.html)<br>
15、[自定义右键菜单改变背景图片](https://rawgit.com/YUUXIAO/webProject/master/righthandBackground/index.html)<br>
16、[实现简易选项卡功能](https://rawgit.com/YUUXIAO/webProject/master/tabChange/简易选项卡.html)<br>
17、[数组方法实现文字查找和替换功能](https://rawgit.com/YUUXIAO/webProject/master/textSearch/index.html)<br>
18、[实现网页换肤功能](https://rawgit.com/YUUXIAO/webProject/master/webChangcolor/%E7%BD%91%E9%A1%B5%E6%8D%A2%E8%82%A4.html)<br>
19、[数组方法实现文字搬运工](https://rawgit.com/YUUXIAO/webProject/master/wordRmove/index.html)<br>
20、[贪吃蛇小游戏](https://rawgit.com/YUUXIAO/webProject/master/snake/snake.html)<br>
21、[实现删除标签功能](https://rawgit.com/YUUXIAO/webProject/master/tag/index.html)<br>
22、[夜晚星空闪烁](https://rawgit.com/YUUXIAO/webProject/master/starBlink/index.html)<br>
23、[ 数码时钟翻转切换数字](https://rawgit.com/YUUXIAO/webProject/master/clock/index.html)<br>
24、[JS实现生成随机验证码并验证功能](https://rawgit.com/YUUXIAO/webProject/master/randomCode/index.html)<br>