随笔分类 -  js

冒泡排序
摘要：#### 冒泡排序 原理：数组中有 `n` 个数，比较每相邻两个数，如果前者大于后者，就把两个数交换位置；这样一来，第一轮就可以选出一个最大的数放在最后面；那么经过 `n-1`（数组的 length - 1） 轮，就完成了所有数的排序。 ```js var arr=[3,4,2,1]; function order(arr){ var temp; for(var i=0;i<arr.length; 阅读全文
posted @ 2019-11-07 19:39 rain92 阅读(108) 评论(0) 推荐(0)
简单的上传图片预览功能
摘要： 阅读全文
posted @ 2016-12-13 16:01 rain92 阅读(209) 评论(0) 推荐(0)
自由落体和抛物线运动
摘要：自由落体是个加速的过程，让速度递加，再给速度个系数，减小速度即可 抛物线是在自由落体的前提下left也会变，速度，速度系数 js函数 阅读全文
posted @ 2016-11-27 21:46 rain92 阅读(2049) 评论(0) 推荐(0)
简单的碰撞运动
摘要：需要的js //碰撞运动 //对运动的方向以及临界值的处理 function bumpMove(obj) { clearInterval(obj.timer); var speedX = 10; var speedY = 10; timer = setInterval(function() { var L = obj.offsetLeft + s... 阅读全文
posted @ 2016-11-27 18:06 rain92 阅读(342) 评论(0) 推荐(0)
利用弹性运动的原理做弹性菜单
摘要：主要是速度以及临界条件的处理弹性运动的函数 function startMove(obj,target) { clearInterval(obj.timer); var speed=0; obj.timer = setInterval(function() { speed += (target - obj.offsetLeft) / 6; ... 阅读全文
posted @ 2016-11-25 19:22 rain92 阅读(189) 评论(0) 推荐(0)
带运动的返回顶部
摘要：1、top值的设置 2、scrollTop的变化 阅读全文
posted @ 2016-11-25 11:01 rain92 阅读(166) 评论(0) 推荐(0)
网站优化--图片的预加载与懒加载（下）
摘要：预加载：通过创建image对象 阅读全文
posted @ 2016-11-25 10:51 rain92 阅读(282) 评论(0) 推荐(0)
网站优化--图片的预加载与懒加载（上）
摘要：1、延迟加载即懒加载，主要目的是作为服务器前端的优化，减少请求数或延迟请求数，在一些图片非常多的网站中非常有用，当图片位置进入到可视区的时候才会被加载，这样对于含有很多 图片的比较长的网页来说，可以加载的更快，并且还能节省服务器带宽 最常用的方式是：监控滚动条的高度，当滚动条高度和可视区高度之和小于 阅读全文
posted @ 2016-11-25 10:50 rain92 阅读(1128) 评论(0) 推荐(0)
图片的展开收缩
摘要：效果 阅读全文
posted @ 2016-11-14 19:39 rain92 阅读(244) 评论(0) 推荐(0)
过滤敏感词-正则表达式
摘要： 阅读全文
posted @ 2016-11-10 18:29 rain92 阅读(5604) 评论(0) 推荐(0)
瀑布流式布局
摘要：今天终于搞懂了瀑布流式布局，哈哈，总结下 瀑布流式布局分为两种类型：1、每一列都限定宽度不限定高度的布局（使用浮动）2、宽度不是写死的，是根据页面的放大缩小变化的（定位布局） 瀑布流式布局的重点是：每个新加载的模块都应该显示在原有模块高度最小的下方 注意事项： 图片：接收到的数据在插入到文档的过程中 阅读全文
posted @ 2016-11-02 18:26 rain92 阅读(1289) 评论(0) 推荐(0)
qq菜单的折叠与展示
摘要：敲出每个小例子是一种进步 html结构： css样式： js代码： 效果截图 阅读全文
posted @ 2016-09-23 10:25 rain92 阅读(195) 评论(0) 推荐(0)
取非行间样式
摘要：html代码： css代码： js代码： 取行间样式的js代码： 阅读全文
posted @ 2016-07-18 15:43 rain92 阅读(165) 评论(0) 推荐(0)
变量 求和
摘要：变量类型：number string boolean function object undefined typeof a 返回a变量所属类型 isNaN() 函数用于检查其参数是否是非数字。 alert(NaN==NaN) false input中的value值类型是string，需要类型转换；同 阅读全文
posted @ 2016-07-15 14:08 rain92 阅读(224) 评论(0) 推荐(0)
js简易日历
摘要：js简易日历中设计的知识点：选项卡切换 数组 innerHTML 连接符 与选项卡的区别：div的个数不同 连接符中需要注意的：(优先级) "abc"+12+3+"def" 结果：abc123def "abc"+(12+3)+"def" 结果：abc15def html代码： css代码： js代码 阅读全文
posted @ 2016-07-15 11:24 rain92 阅读(427) 评论(0) 推荐(0)
选项卡js
摘要：趁着公司不忙，抓紧充充电，开始可能会写的不好，但是每写一个都是一点进步，哈哈，加油 用js实现选项卡切换 1.获取元素 2.初始状态 3.通过循环清空元素状态 4.点击操作以及对应的内容切换 5.自定义索引（通过HTML加进去的自定义属性，部分浏览器不支持，必须通过js添加） html代码： css 阅读全文
posted @ 2016-07-15 09:48 rain92 阅读(212) 评论(0) 推荐(0)
tab切换(修改)
摘要：html代码： css代码： js代码： 调用： $(".tab li").on("click",function(){ tabList(".tabContent",$(this).index());}) 阅读全文
posted @ 2016-06-17 10:38 rain92 阅读(272) 评论(0) 推荐(0)
页面悬浮窗（点击展开或者收缩）
摘要：html代码： css代码： js代码： 效果如下： 阅读全文
posted @ 2016-06-15 15:36 rain92 阅读(1897) 评论(0) 推荐(0)
tab切换
摘要：啥也不说了，直接上代码吧，争取每天一个小例子，加油~~~ html代码： css代码： js代码： 运行效果： 阅读全文
posted @ 2016-06-14 14:32 rain92 阅读(181) 评论(0) 推荐(0)