js特效
关注
分享
扫一扫
githubcurry
githubcurry
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
雪花跟随鼠标动画效果样式
【代码】雪花跟随鼠标动画效果样式。原创 2023-05-05 15:32:17 · 299 阅读 · 0 评论 -
JS实现一个简单的抽奖页面
一个简单的基于javascript开发出来的抽奖页面，自己也可以diy一个抽签页面，选择恐惧症必备！！！原创 2021-03-09 12:20:03 · 2528 阅读 · 3 评论 -
JS特效四：拖拽效果（显示实时的坐标！）
今天来讲一个很常用的拖拽功能，主要是利用一点css，js和jquery，很简单但同时也很重要，掌握好才是最关键的！下面来看下效果图：这里可以看到，在鼠标hover的时候会有一个透明度的变化和一个盒子阴影！并且在右下角会实时的显示出小方块移动时横纵坐标的变化！可以看到有一个盒子阴影在鼠标单击按住的时候会变红，然后可以拖动小块随意移动我们在看代码之前可以先了解下jquery中的基本知识（选择器，css控制器什么的）和offset()和clientX,clientY。思路很简单，就是分别监听鼠标.原创 2020-12-09 20:53:05 · 1979 阅读 · 6 评论 -
JS特效三：波纹小球（绝对炫酷！）
今天来讲一个JS的特效，主要用到的是定时器和选择器，也算是一个比较基础的但同时也是效果很炫的一个特效。老规矩，先来看看效果！样式效果1.这是一开始的时候2.鼠标点击一个小球3.随着时间慢慢变化4.像波纹一样的传播5.后续的小球会慢慢变小视频还没过审核，过了我会发在评论区。设计思路1.首先是先用js生成一个15行15列的div矩阵，并添加到父级container中，然后设置小div的margin: 8px;和border-radius: 50%;，让这些小的div呈现为圆形，并且.原创 2020-12-09 11:23:10 · 1846 阅读 · 11 评论 -
JS特效三：LightBox（轮播图+图片弹窗）
今天的特效是一个很常用的图片查看。结合了轮播图和图片弹窗，所以这两个没有理解的，还是先去看看。然后再来理解这个哦！首先我们看下效果：首先是查看图片的初始网页（注意图片hover的时候有阴影）这是点进去图片进入的图片查看，然后还有轮播图效果！最后就是按钮的hover效果其中要说明的就是上一张和下一张的这个属性：user-select: none;这个是防止用户在复制的时候复制走这个符号！然后就是js代码比之前两个多一点，不过认真理解还是很简单的，希望大家多思考，多练习。详细的.原创 2020-12-06 00:22:05 · 1936 阅读 · 7 评论 -
JS特效二：图片弹窗
今天来看一个商品后台页面设计时常用的js效果，图片弹窗。就是在鼠标点击小图片的时候，会以一个弹窗的形式放大图片，方便我们查看细节，而且还有很多动效在里面。我们先来看看效果图：这是鼠标在图片外，就是一张小图，加了一点圆角当鼠标移到图片上的时候就会有阴影效果和透明度变化点击小图片就是这样的了，可以查看大图设计思路也很简单，就是先写出来基本的html和css布局，这里说下×是一个叉号。然后js里面设置两个点击事件，每个点击事件通过方法改变一些元素的css样式。代码里的.原创 2020-12-03 13:13:38 · 5356 阅读 · 23 评论 -
JS特效一：图片轮播图（JS必须掌握的特效）
今天来讲一个很常用的js特效，这个不用说了，是个网页应该都可以看到，虽然不难，但是对很多人来说，也是需要一定的基础来掌握（html和css不难，js需要认真看，细细品）。话不多说，上图片（默认为第一张图片）而且是响应式的（随着屏幕大小的变化而变化！）：需要注意的点都给大家圈起来了！需要注意的就是还有一些css样式，不懂的可以看这里主要用到就是点击的时候css属性的转移，重点都在代码中标注出来了，希望大家认真琢磨！最后附上源码！<!DOCTYPE html><html l.原创 2020-12-02 00:00:42 · 8194 阅读 · 34 评论