自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

原创 十分钟上手-搭建vue2.0开发环境(新手教程一)

想写一些关于vue的文章已经很久了,因为这个框架已经火了很久,在公司里用的框架都比较老旧,但怎么也得跟上前端发展变化的潮流,这不,开始使用vue开发项目了,一遍开发一边踩坑中,今天要记录的是五分钟搭建vue开发环境,运行GitHub上的开源项目。步骤很简单,只是在搭建环境的过程中会遇到各种各样奇怪...

2020-03-19 15:54:31 15 0

原创 五分钟上手-微信小程序组件库 iView Weapp

微信UI组件库 iView Weapp 介绍:iView Weapp 提供了与 iView 一致的 UI 和尽可能相同的接口名称,大幅度降低了学习成本,是一套一套高质量的微信小程序 UI 组件库。 https://weapp.iviewui.com/ 使用步骤 1:首先在github上面下载...

2019-06-24 16:06:09 82 1

原创 小程序iView Weapp实现一个倒计时

昨天把组件库 iView Weapp研究了一下,里面确实有很多不错的组件,对于组件的使用,也写了一下笔记:五分钟上手-微信小程序组件库 iView Weapp https://www.jianshu.com/p/09b4515152ff 今天用小程序iView Weapp实现一个倒计时。具体可参考...

2019-06-24 16:05:20 108 0

原创 小程序调用天气接口并且渲染在页面

五分钟上手-微信小程序组件库 iView Weapp https://www.jianshu.com/p/09b4515152ff 前两天写了关于组件库 iView Weapp的教程,其实也就是把文档上的例子拿出来体验了一遍,今天写一个具体的例子,调用一个免费的天气接口的api,并且把所获取的内容...

2019-06-24 16:04:28 258 0

原创 小程序计时器

之前写了一个小程序倒计时的demo,在网上查看了一下,计时器很少有demo,现在来写一个。 wxml <view class="container"> {{timecount}}</view> <button bindtap='sta...

2019-06-24 16:03:47 75 0

原创 小程序Echarts图表组件使用

1:下载 GitHub 上的 项目 https://github.com/ecomfe/echarts-for-weixin 2:但项目下载之后,打开小程序开发工具,可以看到效果如下,适配性还是比较完美的。 如果是在项目里面引入组件的话,打开从github上面下载的代码,将ec-canvas...

2019-06-24 16:03:18 194 0

原创 小程序踩坑-Setting data field "list" to undefined is invalid.

今天遇到了一个这样的错误,当调用图片免费的接口api的时候 https://api.apiopen.top/getImages 报了这样的错 Setting data field “list” to undefined is invalid. 仔细检查了一下代码发现自己的错误原因 错误原因: 将...

2019-06-24 16:02:42 255 0

原创 小程序Vant使用教程

Vant Weapp 是有赞移动端组件库 Vant 的小程序版本,两者基于相同的视觉规范,提供一致的 API 接口,助力开发者快速搭建小程序应用 两大参考神兽: 文档:https://youzan.github.io/vant-weapp/#/intro 开源:https://github.co...

2019-06-20 17:09:09 1748 0

原创 当电量少于百分之20的时候,字体显示红色

<text style="{{item.batStyle}}" class="battery">电量:{{item.battery}}%</text> success: function(res) { const...

2019-06-20 17:08:11 73 0

原创 小程序踩坑-appJSON["tabBar"][2]["pagePath"] "pages/test/test" 需在 pages 数组中

又遇到了一个bug,开心ing,报错如下,相信应该在入门的时候,很多人都遇到了这样的bug。 VM2040:5 appJSON["tabBar"][2]["pagePath"] "pages/test/test" 需在 pages 数组中...

2019-06-20 17:07:25 1261 1

原创 iView Weapp教程

微信UI组件库 iView Weapp 介绍:iView Weapp 提供了与 iView 一致的 UI 和尽可能相同的接口名称,大幅度降低了学习成本,是一套一套高质量的微信小程序 UI 组件库。 https://weapp.iviewui.com/ 使用步骤 1:首先在github上面下载...

2019-06-20 17:06:48 403 0

原创 iView Weapp实现一个倒计时

昨天把组件库 iView Weapp研究了一下,里面确实有很多不错的组件,对于组件的使用,也写了一下笔记:五分钟上手-微信小程序组件库 iView Weapp https://www.jianshu.com/p/09b4515152ff 今天用小程序iView Weapp实现一个倒计时。具体可参考...

2019-06-20 17:06:07 343 0

原创 Thymeleaf 引入公共代码页面

前面写过,写前端页面的时候,尤其是写后台管理系统,每个页面都会遇到一些重复的代码,比如左侧导航栏,头部的信息,前面也做了一些整合,把代码放在了公共的页面,每个页面调用时只需要用script引入即可。 在HTML页面中引入公共的部分的代码 https://www.jianshu.com/p/f50c...

2019-06-18 15:46:26 102 0

原创 Echarts报错-Uncaught ReferenceError: echarts is not defined

Echarts报错-Uncaught ReferenceError: echarts is not defined 造成这个错误的原因:导入js的位置不对,要在使用时导入,option前一点导入,不能导入太前了。 在我的项目里面 ,是先引入了自己写的文件js,再引入了echarts插件,导致加...

2019-06-18 15:45:12 1035 0

原创 ztree实现一棵树

前面陆陆续续的写过一些ztree的文章,但调用的是后端的接口,demo拿过去没有办法可以直接查看前端的界面,这就造成了一部分人对此理解的困扰。 jQuery的ztree仿windows文件新建和拖拽效果 https://www.jianshu.com/p/bfa67325719c ztree实现编...

2019-06-18 15:43:52 37 0

转载 智能终端软件开发——刮刮卡

日常生活,抽奖是大多数人都喜欢的一项活动。抽奖的形式有很多种,例如彩票、刮刮卡等。Android系统也可以实现刮刮卡的效果,需要用到Bitmap、Matrix、Canvas等类。接下来通过一个案列来演示刮刮卡的实现过程,具体如下。 1.创建程序 创建一个名为ScrCard的应用程序,指定包名为cn...

2019-06-18 15:41:46 60 0

原创 DOM的实际应用

DOM 在 JavaScript 课程中我们详细的探讨过,它是一种文档对象模型。方便开发者对 HTML 结构元素内容进行展示和修改。在 JavaScript 中,DOM 不但内容庞大繁杂,而且我们开发的过程中需要考虑更多的兼容性、扩展性。 在 jQuery 中,已经将最常用的 DOM 操 作方法进...

2019-06-04 15:56:55 43 0

原创 Font Awesome

在bootstrap框架的使用中,字体图标必不可少,Font Awesome 一套绝佳的图标字体库和CSS框架,值得学习。 网址:http://fontawesome.dashgame.com/ ###使用示例 1:引入Font Awesome图标文件或者使用使用LESS或SASS的方法来自...

2019-05-31 15:13:11 58 0

原创 clientX和clientY

####需求: 做项目中遇到一个这样的需求,点击属性菜单节点,出现显示框,显示框的位置随着鼠标点击的位置距离而改变。 ###教程: clientX 事件属性 http://www.runoob.com/jsref/event-clientx.html clientY 事件属性 http://www...

2019-05-30 19:23:35 159 0

原创 echarts 仪表盘

####1:echarts 后面仪表盘三分钟上手示例 引入相关的文件 <!-- 引入 echarts.js --> <script src="js/echarts.min.js"></script> <script src=...

2019-05-30 19:23:04 90 0

原创 bootstrap五列布局

我们知道,在使用Bootstrap栅格的时候,我们可以对网页方便的进行模块分割。Bootstrap 包含了一个响应式的、移动设备优先的、不固定的网格系统,可以随着设备或视口大小的增加而适当地扩展到 12 列。 它包含了用于简单的布局选项的预定义类,也包含了用于生成更多语义布局的功能强大的混合类。如...

2019-05-30 19:22:32 175 0

原创 CSS消息数字提示

今天写个简单的小demo,关于CSS实现头像右上角消息数字提示,样式如下如图所示,在微信和扣扣消息里面比较常见。 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> ...

2019-05-30 19:21:49 992 0

原创 CSS元素的出现和隐藏

前两天不知道是哪位同学问的问题,鼠标滑过一个div的时候,怎么控制子集元素属性的出现和隐藏,然后我说用用mouseover和mouseout这两个鼠标事件就行,那如果js不怎么熟悉的时候,可以用CSS: hover方法来写吧。 方法: 使用a 控制其他块的样式: 使用a控制a的子元素 b: ...

2019-05-30 19:21:14 54 0

原创 解决o.s.web.servlet.PageNotFound 异常

在eclipse里面启动项目的时候,会出现以下的异常o.s.web.servlet.PageNotFound 。 Closing non transactional SqlSession [org.apache.ibatis.session.defaults.DefaultSqlSession@7...

2019-05-30 16:26:48 239 0

原创 echarts柱状图

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>五分钟上手之柱状图</title> ...

2019-05-29 19:59:55 55 0

原创 echarts改变颜色

#一:柱状图改变颜色 代码: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head&g...

2019-05-29 19:59:20 582 0

原创 echarts多条折线图

参考链接:echarts官网:http://echarts.baidu.com/ 原型图(效果图): 代码: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> ...

2019-05-29 19:58:45 100 0

原创 hcharts堆叠柱形图和异步加载

原型图类似如下: <!DOCTYPE > <html> <head> <meta charset="utf-8"><link rel="icon" href="http...

2019-05-29 19:58:05 39 0

原创 echarts折线图实例

五分钟上手: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>五分钟上手之折线图</ti...

2019-05-29 19:57:11 1636 0

原创 css悬浮阴影

要实现的效果图: 实现的代码: -webkit-box-shadow:0px 3px 3px #c8c8c8 ; -moz-box-shadow:0px 3px 3px #c8c8c8 ; box-shadow:0px 3px 3px #c8c8c8 ; 整个页面的代码: <!DOCTY...

2019-05-29 19:56:27 58 0

原创 css选择器汇总

要使用css对HTML页面中的元素实现一对一,一对多或者多对一的控制,这就需要用到CSS选择器。选择器就是选择器用来指定样式的作用范围。 类选择器: 类选择器在css中比较常见,首先要在普通标签中设置一个类,类名不可为中文,然后在 style 标签中添加该类名的样式。类选择器在选择器前要加一个点”...

2019-05-29 19:55:50 34 0

原创 css时间轴

原型: 代码: <!DOCTYPE html > <html> <head> <link rel="stylesheet" href="http://cdn.static.runoob.com/libs/boots...

2019-05-29 19:54:51 230 0

原创 bootstrap上传照片

实际项目中运用: 功能:实现上传图片,更改上传图片,移除图片的功能 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></tit...

2019-05-29 19:54:20 319 0

原创 layer弹框

官方介绍:layer至今仍作为layui的代表作,受众广泛并非偶然,而是这五年多的坚持,不断完善和维护、不断建设和提升社区服务,使得猿们纷纷自发传播,乃至于成为今天的Layui最强劲的源动力。目前,layer已成为国内最多人使用的web弹层组件,GitHub自然Stars3000+,官网累计下载量...

2019-05-29 19:53:36 37 0

原创 微信公众号之全局计时器的案例

#####需求一:index.html里面的数据从后台获取并渲染在前端页面 代码: //index.html页面JS代码如下 //判断openid是否已经获取 if(sessionStorage.getItem("openid") == null){ /...

2019-05-27 17:05:30 85 0

原创 鼠标focus事件实例

当鼠标聚焦时输入框变色 css相关,鼠标点击输入域后出现有颜色的边框 原理:css伪类之input输入框鼠标点击边框变色效果 伪类元素的使用::focus ###一:当输入框获得焦点时,改变它的背景色 效果图:当鼠标聚焦时输入内部填充色改变 <!DOCTYPE html> <h...

2019-05-27 17:05:00 206 0

原创 点击按钮div变色

<!DOCTYPE html> <html> <head> <title>点击按钮div变色.html</title> <meta charse...

2019-05-27 17:04:24 2034 0

原创 5个JS模板引擎

1:百度模板引擎(baiduTemplate) http://baidufe.github.io/BaiduTemplate/ baiduTemplate希望创造一个用户觉得“简单好用”的JS模板引擎,应用场景:前端使用的模板系统 或者 后端javascript环境发布页面,功能概述:提供一...

2019-05-27 17:03:43 96 0

原创 前端script引入公共的代码

在做前端网页的时候,会涉及到很多界面,有的时候,这些界面都会有重复的代码,比如侧边栏菜单的重复代码,头部导航的 重复代码,底部的重复代码,这个时候,为了使每个页面的代码看起来简洁明了,我们需要把这些重复的代码放到公共的页面里面,在具体页面只需引用即可。 主要代码 <div id="...

2019-05-27 17:03:07 195 0

原创 Bootstrap Table实例

基于 Bootstrap 的 jQuery 表格插件,通过简单的设置,就可以拥有强大的单选、多选、排序、分页,以及编辑、导出、过滤(扩展)等等的功能。 官网:http://bootstrap-table.wenzhixin.net.cn/zh-cn/ 代码: <!DOCTYPE htm...

2019-05-27 17:02:19 993 0

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