个人分类:小demo(6)

一个canvas环形刻度进度条效果

公司项目的一个demo,需要效果如图所示:在这个论坛的问问上问了,希望得到好的思路,没人回我,只好自己想了一个,代码如下:html代码效果预览<!DOCTYPEhtml><html><head><metacharset="UTF-8"><metaname="renderer"content="webkit"><metahttp-equiv="X-UA-Compatible"content="IE=edge,chrome=1"><metaname="viewport"content="width=1080,user-scalable=0"/><metaname="apple-mobile-web-app-capable"content="yes"/><metaname="apple-mobile-web-app-status-bar-style"content="black"/><metaname="description"content=""><metaname="keywords"content=""><title>de

发表于 2017-01-06 17:25:15

初次实验:webpack+vuejs实现前端组件化

早就写好的一片文章忘了发,哈哈,补上:对于现在前端插件的频繁更新,我也是无力吐槽,但是既然入了前端的坑就得认嘛,所以多多少少要对组件化有点了解,至于神马是组件化,出门左转问度娘哈。今天有空,试了试使用webpack+vuejs来做个小组件,接下来就是这个简单的demo和我总结的一点点小经验哈。首先webpack和vue我就不做介绍了,这些大名鼎鼎的东西作为一个前端应该是要懂得哈,不懂的话就得自己去了解哦。说到这里不得不说vue-loader,vue-loader支持将.vue文件转换为一个vue组件,而且该.vue文件内甚至可以包含组件的样式,这个不得不说是一个组件化的亮点。.vue文件的格式可以如下:html代码效果预览<template><h

webpack+vue+nwjs仿网易云播放器

webpack+vue+nwjs仿网易云播放器

好久没来这里了,大家伙还好咩~~~前段时间逛贴吧,看到有个大神在linux上用nwjs撸了个音乐播放器,那我想着我也做做看吧,正好最近一些mvvm框架也挺火的,于是在纠结于是用ng,react还是vue。最后选择了vue,为什么呢?因为…….因为我英语不好啊!只有vue才有比较完整的中文文档嘛!哈哈哈哈!!回到正文,这个播放器外观完全借鉴网易云,请勿吐槽。具体实现的功能有:1.本地音乐导入,可导入本地文件夹内歌曲,并且播放。2.再线搜索音乐,调用百度音乐api,可以搜索下载音乐。3.创建喜欢列表,搜索到的音乐可以添加至喜欢列表。接下来说说遇到的坑:首先,由于是webpack+vue的项目,所以很自然的会用到vue-loader,由于第

node.js + socket.io 实现点对点随机匹配聊天

真心佩服那些可以经常发布笔记的人,其实我也想经常发来的,奈何技术不够加上懒,要向大神们多多学习了,前段时间有用bomb平台自带的socket写一个聊天室,其实基本就是改了改它的demo,这次想实现一个随机私聊,所以自己基于node和socket.io来搭服务,当然,第一次用node做东西玩,虽然做的不好,但是也蛮分享下哈。下面是demo地址,可以自己开两个网页和自己聊天看效果哦~基于node和socket的随机匹配聊天先说说用到的东西,node用来做后台服务,express用来托管静态资源,然后socket.io用来传送聊天数据。接下来说说思路,其实用socket.io来传数据是很简单的一件事情,我们只需要再前端页

简单的js+paas平台聊天室

w3cfuns改版啦,看起来棒棒的,前几天闲着无聊,就玩了下paas平台,发现了一个即时聊天的小插件,然后略微修改了一下,做成一个简易的聊天室,戳我试玩,这个具体原理就是平台会监控数据库里更新状况,如果有更新就返回回来一条数据...好吧,我是闲的蛋疼,哈哈差点找不到在哪插入代码了...源码如下html代码片段<!DOCTYPEhtml><html><head><metacharset="utf-8"><title>chatroomdemo</title><linkrel="stylesheet"type="text/css"href="css/style.css"><scriptsrc="http://7u2sas.com1.z0.glb.clouddn.com/js/jquery.1.8.3.min.js"></script><scriptsrc="js/bmobSocketIo.js"></script><script

越来越懒了-图片预加载插件

感觉自己最近越来越懒散了,一直没有好好的写过什么东西。正好前几次的项目都是h5页面,基本都是使用swiper插件和css3动画来完成。效果就类似易企秀生成的页面效果。不过这类页面一般都一个特点,那就是页面中有大量的图片,如果图片压缩不到位或者网络欠佳,很可能就会出现页面已经开始动画,但是图片没有加载完全的情况。为了避免这类情况,不得不去调用一个预加载插件,这里,我简化了之前同事写的一个图片预加载插件。代码如下:HTML代码//JavaScriptDocumentvarIMGPATH="image/"//图片路径前缀方便控制图片路径//图片名称数组varIMG=["bg1-2.jpg","bg1-3.jpg",

发表于 2015-11-04 11:03:25