自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(10)
  • 收藏
  • 关注

转载 谈谈令人头大的prototype 和__proto__

首先要明确几个事情: prototype和__proto__ 1.prototype:每个函数都会有一个prototype这个属性,这个属性是一个指针,它指向一个对象,这个对象就叫做原型对象; 原型对象也是一个对象它是由Object创建出来的实例!!!切记!!它也有__proto__,指向Object.prototype,而Object.prototype自己也是一个原型对象别的原...

2018-06-23 10:20:00 86

转载 原生JS写一个淡入淡出轮播图

任何网站主页都离不开一个轮播图,这是滚动播放新闻或者广告或者内容的招牌,类型有很多,我们可以做一个淡入淡出的轮播图。 首先分析,淡入淡出指的是没有滑动效果,一张图片消失的时候另一张图片接着显示出来,仔细分析可以知道在一个轮播框内其实利用绝对定位放了好几张图片, 利用他们的透明度的改变依次出现和消失。 效果图如下: 布局如下: <div id="banne...

2018-06-07 18:09:00 185

转载 模拟聊天对话框

利用原生JS里的事件对象我们可以来模拟下聊天软件的对话框效果如下: CSS: *{ margin: 0; padding: 0; font-size: 16px; font-family: "微软雅黑"; } li{ list-style: none; } .main{ ...

2018-06-06 20:18:00 671

转载 全选反选的小案例

电商网站中当选中一个总按钮那么其他分按钮衣会被选中,而同理当每一个分按钮被选中的时候总按钮也能反过来被选中,这个小功能在购物车里很常见 HTML代码如下: <body> <label for="all">全选</label><input type="checkbox" id="all"> <div id="c...

2018-06-04 20:56:00 136

转载 原生js做一个简单的进度条

用原生js做进度条,布局非常简单,一个盒子里放一个span标签,让它的宽度为0,并且转成块元素。 主要用定时器动态增加span的宽度,并且当它的宽度大于父级盒子的宽度的时候停止 效果如下: 一 css如下: *{ margin: 0; padding: 0; } #box{ width: 500px; height: ...

2018-06-01 20:35:00 285

转载 点击回到顶部的按钮

在很多网站页面中如果我们把页面下拉很多的时候,右边一般都有一个按钮点击可以直接回到顶部,并且无论滚动条下拉多少这个小方块都保持在右边画面中心 简单分析下我们知道,这个小方块是绝对定位,当我们拉动滚动条的时候获取滚动的距离,然后让方块的top值等于滚动的距离。触发方块的点击事件时让top值为0 一 html && css 代码如下: <style> ...

2018-06-01 19:52:00 193

转载 简易年历

利用原生js我们可以做一个简易的年历。 效果如下图所示: css代码如下: <style type="text/css"> * { padding: 0; margin: 0; } li { list-style: none; } body { background: #f6f9fc; font-family: arial; } .calendar ...

2018-06-01 19:32:00 140

转载 放大镜

在电商网站的商品详情业,当我们鼠标移上商品,通常会出现一个类似放大镜的东西,让我们可以将商品的细节看的更清楚,那么今天我们来做一个简单的放大镜效果。 分析:将大图以及中图的图片地址作为小图的自定义属性,当鼠标移上小图的时候让大图中图对应出现,滤镜盒子和大图都是绝对定位,让滤镜盒子动的同时让大图同步动起来 二者移动比例为1:2,并且注意方向是相反的,否则我们看不到大图的有些部分,另外注...

2018-05-26 15:25:00 75

转载 打印三角形练习for循环

* //打印直角三角形 for(var i=1;i<6;i++){ for(var j=1;j<=i;j++){ document.write("#"); } document.write("<br/>");} for(var i=1;i<6;i++){ //i: 1 2 3 4 5 for(var j=1;j<6-i...

2018-05-24 12:14:00 226

转载 简单的打字游戏

我们以前刚接触电脑的菜鸟时期应该都有玩过一些打字游戏,一些字母往下掉然后我们按下相应字母键然后这个字母消失;首先我们来分析下这个游戏内在原理和具体步骤: 内在原理分析:首先我们得随机生成大写字母并且得让它一直生成,其次我们得让它掉落,掉落的速度是随机的,并且我们不能让它一直无限制掉,得有退出时间,再次我们要建立交互,当玩游戏的人输入相应的字符,这时产生键盘事件,输入的字符和页面上...

2018-05-22 16:03:00 223

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除