js图片轮播手动切换特效 2017年02月06日 86 阅读 先瞄一眼js图片轮播手动切换特效图: 代码:<html><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><title>无标题文档</title><style>* {padding:0px;margin:0px;}#content {width:400px;height:400px;b...
js手机号批量滚动抽奖实现代码 2017年02月06日 92 阅读 我们平时在看一些选秀节目或一些歌唱类比赛节目时经常会看到在现场的大屏幕上会有观众的手机号在滚动来选出谁是幸运观众或谁中了什么奖项,这些手机号都是现场观众或场外观众在给选手投票时产生的,当主持人一声开始令下,大屏幕上的手机号就会快速随机滚动,当主持人一声停令下,大屏幕上会随机出现几个停止滚动的手机号,这种手机号批量随机滚动的效果,就是我们今天要实现的效果。注意,在这个效果的实现当中最核心的就是随机和不重复。下面,我就简单来介绍一下原理:1、随机,我们要写一个...
移动端点击态处理的三种实现方式 2017年02月06日 98 阅读 前言在开发移动端页面的时候,为了提高用户体验,通常会给被触控的元素加上一个效果来对用户的操作进行反馈。这种反馈主要有三种实现方式,有需要的朋友们下面来一起看看吧。一、伪类:active :active伪类常用于设定点击状态下或其他被激活状态下一个链接的样式。最常用于锚点<a href="#">这种情况,一般主流浏览器下也支持其他元素,如button等。在多按键的鼠标系统中,:active只适用于主按键,目前的大部分情况都是左键即主键。该伪类下定...
Vue数据驱动模拟实现4 2017年02月06日 83 阅读 一、前言在"模拟Vue之数据驱动3"中,我们实现了为每个对象扩展一个$set方法,用于新增属性使用,这样就可以监听新增的属性了。当然,数组也是对象,也可以通过$set方法实现新增属性。但是,对于数组而言,通常我们是通过push之类的方法吧。PS:Vue中明确指出push、pop、shift、unshift、splice、sort、reverse方法为变异方法,可以通过它们监听属性变化,触发视图更新(详情见here)下面,我们就一起来实现这些Array的变异...
js中常用的Math方法总结 2017年02月06日 103 阅读 1.min()和max()方法Math.min()用于确定一组数值中的最小值。Math.max()用于确定一组数值中的最大值。alert(Math.min(2,4,3,6,3,8,0,1,3));//最小值alert(Math.max(4,7,8,3,1,9,6,0,3,2)); //最大值2.舍入方法Math.ceil()执行向上舍入,即它总是将数值向上舍入为最接近的整数;Math.floor()执行向下舍入,即它总是将数值向下舍入为最接近的整数;Mat...
利用VUE框架,实现列表分页功能示例代码 2017年02月06日 80 阅读 先来看一下效果图: 功能描述: 1. 点击页面序号跳转到相应页面; 2. 点击单左/单右,向后/向前跳转一个页面; 3. 点击双左/双右,直接跳转到最后一页/第一页; 4. 一次显示当前页面的前三个与后三个页面; 5. 始终显示最后一个页面;HTML: <!-- 分页开始 --><div class="u-pages" style="margin-bottom:20px; margin-top:10px;"> <ul> ...
JavaScript中localStorage对象存储方式实例分析 2017年02月06日 75 阅读 本文实例讲述了JavaScript中localStorage对象存储方式。分享给大家供大家参考,具体如下:[Local storage limitations]文章中提及JavaScript里的local storge的限制,例子中在localStorage里存储了一个bool型的数据,但是却没有像我们期待的一样进行存储。当我们存储布尔型,数值型,字符串型时,localStorage对象会将我们存储的数据默认转为字符串字面量。localStorage[0]...
angular2倒计时组件使用详解 2017年02月06日 80 阅读 项目中遇到倒计时需求,考虑到以后在其他模块也会用到,就自己封装了一个组件。便于以后复用。组件需求如下: - 接收父级组件传递截止日期 - 接收父级组件传递标题组件效果变量组件countdown.html代码<div class="count-down"><div class="title"><h4>{{title}}</h4></div><div class="body"><di...
JavaScript实现星级评分 2017年02月06日 89 阅读 事件onmouseover<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml" ><head> <title>JavaScript星级评分...
那些精彩的JavaScript代码片段 2017年02月06日 76 阅读 精彩的JavaScript代码片段,分享给大家1.根据给定的条件在原有的数组上,得到所需要的新数组var a = [-1, -1, 1, 2, -2, -2, -3, -3, 3, -3];function f(s, e) {var ret = [];for (var i in s) { // 根据原有的数组长度进行循环ret.push(e(s[i]));}return ret;}f(a, function(n) {return n > 0 ?...
简单的渐变轮播插件 2017年02月06日 75 阅读 话不多说,请看代码:<html lang="en"><head> <meta charset="UTF-8"> <title>Example</title><style>.CreabineCarousel{ width: 100%;height: 700px;background-size: cover;position: relative;}.CreabineCarousel .Cr...
微信小程序 PHP后端form表单提交实例详解 2017年02月06日 103 阅读 微信小程序 PHP后端form表单1.小程序相对于之前的WEB+PHP建站来说,个人理解为只是将web放到了微信端,用小程序固定的格式前前端进行布局、事件触发和数据的输送和读取,服务器端可以用任何后端语言写,但是所有的数据都要以JSON的形式返回给小程序。2.昨天写了登录注册、忘记密码功能,他们实质上都是一个表单提交操作。因此就拿注册功能来写这个例子。3.目录图js文件是逻辑控制,主要是它发送请求和接收数据,json 用于此页面局部 配置并且覆盖全局app...
移动端基础事件总结与应用 2017年02月06日 79 阅读 1.触摸事件touch touchstart 手指放在屏幕上触发 touchmove 手指在屏幕上移动,连续触发 touchend 手指离开屏幕触发 touchcancel 当系统停止跟踪时触发,该事件暂时用不到注意: 1.移动端只能事件只能通过监听函数添加,不能用on添加 2.移动端当中就不要用鼠标的事件 3.移动端的事件会触发浏览器的默认行为,所以在调用事件的时候要把默认行为阻止了ev.preventDefault。demo:document.add...
JS实现仿百度文库评分功能 2017年02月06日 81 阅读 百度文库分享平台大家都知道,今天小编通过一段实例代码给大家介绍基于js实现百度文库评分功能,先给大家展示效果图吧。具体代码如下所示:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/199...
微信小程序 使用canvas制作K线实例详解 2017年02月06日 118 阅读 微信小程序 使用canvas制作K线实现效果图:前言:我们目的是想要一条平滑的曲线来表示均线等,而不是一条转折点明显的折线。因此还得继续探索api。我们发现,在canvas API中,能够画出曲线的有2个beZierCurveTo(num1, num2, num3, num4, x, y)quadraticCurveTo(num1, num2, x, y)这两个api都是通过贝塞尔曲线来绘制路径。好在学习PS的时候,对贝塞尔曲线的具体表现也是有一定的熟练程...
微信小程序-小说阅读小程序实例(demo) 2017年02月06日 115 阅读 今天和朋友聊天说到小程序,然后看在看书,然后我们就弄了个小读书的demo,然后现在分享一下。一、先来上图:二、然后下面是详细的说明首先先说下边的tabBar,项目采用json格式的数据配置,不得不说,现在这个是趋势,.net core的配置也是这种方式了(暴露我是.net 阵营了)。在这里好多同学会发现好多颜色的配置都不管用,是的,现在有效的颜色是有限制的,具体的大家可以进入官方文档去查看。需要几个tabBar,就在list里面写几个,本篇问是三个,所以,...
canvas实现绘制吃豆鱼效果 2017年02月06日 88 阅读 话不多说,请看代码:<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>canvas吃豆鱼</title> </head> <style> body{ text-align:center; } canvas{ background: #efefef; }</style> <bod...
基于jQuery实现照片墙自动播放特效 2017年02月06日 79 阅读 一个动态展示图片的页面:功能:定时从后台取数据,进行页面图片追加。对已经在页面中的图片,进行放大缩小动画展示。目前我们用于微信新关注用户头像展示。<html> <head><meta charset="UTF-8"><meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,use...
js实现微博发布小功能 2017年02月06日 81 阅读 微博发布功能,可发布可删除。样式没设置忽略,主要知识点及注意点:1、动态添加节点标签。2、内容为空时不能发布。3、新发布的内容要在上面。4、内容删除要同时删除掉节点。5、为保持样式输入框要设置为不可拖拽。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <sty...
百度地图API之百度地图退拽标记点获取经纬度的实现代码 2017年02月06日 83 阅读 本文给大家分享百度地图api之百度地图退拽标记点获取经纬度的实现方法,具体代码如下所示: <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta name="viewport" content="initial-scale=1.0, user-sca...