日历组件 原生js】的更多相关文章

自己基于原生js编写的日历组件 git地址: https://github.com/lihefen/calendar.git demo : https://lihefen.github.io/calendar/calendar/Mycalendar.html 效果图 感觉还可以 不过还需要优化,希望大家多提意见…
前言 方法是有参考网上一些资料的,比如闰年的判断,比如每个月第一天是星期几的判断.不说太多,拆分出一个个函数,希望能描述尽可能的清晰明了. 一,判断闰年 //判断闰年 function runNian(_year) { === || (_year% === && _year% !== ) ) { return true; } else { return false; } } 二,判断某年某月的1号是星期几 //判断某年某月的1号是星期几 function getFirstDay(_year…
原生JS面向对象思想封装轮播图组件 在前端页面开发过程中,页面中的轮播图特效很常见,因此我就想封装一个自己的原生JS的轮播图组件.有了这个需求就开始着手准备了,代码当然是以简洁为目标,轮播图的各个功能实现都分别分为不同的模块.目前我封装的这个版本还不适配移动端,只适配PC端. 主要的功能有:自动轮播,点击某一张图片对应的小圆点就跳转到指定图片,有前后切换按钮.使用的时候只需要传入图片的路径以及每张图片分别所对应的跳转路径还有目标盒子ID就可以了,还可以自定义每张图轮播的延时,不过延时参数不是必须…
基于原生js的返回顶部插件,兼容IE8及以上.FF.chrome等主流浏览器. js文件中封装了getScrollTop()和changeScrollTop()函数分别用于获取滚动条滚动的高度和修改滚动条滚动的高度. 使用方法: 1.引入pomelo_toTop.css文件. 2.引入pomelo_toTop.js文件. 3.调用pomelo.toTop(). 组件链接地址如下: https://github.com/pomelott/toTop-plug-in…
最近一直闲来无事,便寻思着做一下自己的个人项目,也想说能使用现在比较流行的一些mvvm框架来做,于是就选用了这样的一个技术栈vue2.0+vue-router+vuex+webpack来做,做得也是多页面应用,使用vue-router,也是想说把多个功能模块化,单个模块spa,实现更高的效果.当然现在还在做的过程中,如果感兴趣可以过来star一下,哈哈,https://github.com/xiaobinwu/Wuji,git clone下来看看. 今天要说的是在做这个项目的过程中,自己想加一个…
最近一直闲来无事,便寻思着做一下自己的个人项目,也想说能使用现在比较流行的一些mvvm框架来做,于是就选用了这样的一个技术栈vue2.0+vue-router+vuex+webpack来做,做得也是多页面应用,使用vue-router,也是想说把多个功能模块化,单个模块spa,实现更高的效果.当然现在还在做的过程中,如果感兴趣可以过来star一下,哈哈,https://github.com/xiaobinwu/Wuji,git clone下来看看. 今天要说的是在做这个项目的过程中,自己想加一个…
在如今VUE盛行的情况下,我们一直在惊叹于VUE的组件的功能,却不知道,原生js早就已经支持了这个功能. 最近在公开课学到的,js还有很多很多需要探索学习. 下面是一个简单的例子 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>创建标签</title> </head> <body> <x-product>测试…
html <div id="app"> <span v-text="number"></span> <btn @click.native="add(10,$event)"></btn> <button @click="add(10,$event)">add</button> </div> <button onclick=&qu…
代码地址如下:http://www.demodashi.com/demo/11316.html   这是一个轮播图组件,这里是代码地址,需要传入容器的id和图片地址,支持Internet Explorer 10+.Firefox.Opera和Chrome等现代浏览器.   之前写一些功能或是特效都是写在一个个函数里,可能因为我是由c语言入门编程,所以更倾向于面向过程的编程方式,没有想过将一个模块抽象成为对象,做成组件.但是由于尝到了重复造轮子之苦.我决定将不可复用的代码做成组件,提高编程效率.以…
组件,本质上是解决某个问题封装的类,在此记录原生js实现侧滑删除 先上效果图 实现思路 1. 确定渲染的数据结构 2. 思考划分布局,总的有两个主要的模块:内容区域和按钮区域 2.1 内容区域保持宽度永远占满设备的宽度 2.2 内容区域和按钮区域之和的宽度等于每一行item的总宽度 3. 每行超出的item的部分设置overflow: hidden; 通过touch相关的API事件监听手势是左滑还是右滑 4. 左滑的时候通过改变元素的一个特定属性来表明左滑,右滑同理 5. 通过css3 slec…