通俗易懂的javascript动态创建svg的函数代码
js动态创建svg在制作网页时是经常使用到的，最简单最容易理解的用处就是如果需要多个相同的svg，如果一个一个地写<svg></svg>，即不好看，也多余，而动态创建，只需要创建一个，然后循环出来就可以了。
常规的动态创建svg
var svgNS = 'http://www.w3.org/2000/svg'; //必须需要，否则可能会导致svg不显示
var svg = documen...
支持移动端图片放大缩小旋转的图片预览js插件viewer.js
淘宝网宝贝详情里的图片，点击后可以弹窗预览，且支持触摸放大缩小，体验非常好，viewer.js插件就是款可以实现类似效果、功能完善的图片预览js插件，有纯js版本和jQuery版本。
viewer.js插件可以实现点击图片弹窗显示，PC端支持鼠标键盘移动、放大缩小，移动端支持触摸移动缩放等，还支持旋转（类似微博图片的旋转）、水平/垂直翻转、全屏幻灯片、缩略图、标题以及多种自定义事件等，另外还提供了多种回调函数。...
vue 绑定style显示背景图片background-image的方法代码
HTML标签使用style background-image属性添加背景图片，需要和vue双向绑定。
HTML代码
<div id="app">
<div class="pic" v-bind:style="{backgroundImage:'url('+ bg + ')'}"></div>
</div>
这里需要注意的是：
在vu...
javascript获取对象数组中指定对象属性的对象下标的方法findIndex()
一个对象数组，已知其中一个对象属性的某个属性值，然后通过该属性值获取其所属对象的对象下标。
简单地说就是通过指定对象属性值获取对象的下标，可以通过 javascript 的 findIndex() 方法实现。
findIndex() 方法的作用是传入一个函数条件，然后返回符合条件的数组的第一个元素的位置（下标）。
示例代码：
var _name = 'tddx'; //已知属性值
var...
javascript实现点击递增递减改变字体字号大小的代码
网页中常见的效果，点击按钮改变内容的字体显示大小，方便眼睛视力不同的人阅读，提高网页的用户体验。
实现方法也比较简单，通过js修改元素css的font-size属性。
实现代码
HTML代码：
<a id="cut" href="javascript:void(0);">A-</a>
<a id="add" href="javascript:void(0);...
纯CSS实现动态加载矩形边线的动画效果
制作web动画效果，通常会想到使用svg或者canvas甚至flash，其实一些简单的动画效果，使用css3属性transition就可以实现，比如动态显示矩形边框线的效果，实现原因是利用过渡效果时宽高显示的时间差。
示意图
实现代码
HTML代码：
<div class="border">
</div>
CSS代码：
.border...
单独调用百度编辑器UEditor视频上传组件的代码
有一个单独的视频设置字段，需要视频上传的功能，自己编写相关代码太麻烦，那么可以通过单独调用 UEditor 编辑器的视频上传组件来实现。
HTML代码
<div class="uploadvideo">
<input name="video" id="video" type="text" class="uplod_video" value="" />
<span class...
微信小程序input组件点击输入时placeholder文字上移
微信小程序原生组件input文本输入框，点击聚焦后，placeholder占位符文字位置会向上编移，原因是input使用了box-sizing: border-box;样式的同时添加了上下内边距（padding）或上下外边距（margin），解决方法可以把box-sizing:border-box;或者上下内外边距去掉。
示例：
wxml代码
<input type="text" confi...
原生javascript实现tab切换效果的代码
Tab切换是网页制作中常用的效果，通过jquery很容易实现，使用原生javascript代码则稍微有点繁锁。
HTML代码：
<div id="tabmenu">
<span class="current>普通会员</span>
<span>超级会员</span>
</div>
<div id="tabbox">...
天地图地图网页API浏览器端javascript调用代码
除了百度、高德提供在线地图调用api外，还有国家测绘地理信息局建设的地理信息综合服务网站“天地图”也提供了相应的地图接口服务，且免费对外开放，可直接使用。
“天地图” API 接口支持HTTP和HTTPS，支持浏览器端和服务器端，可快速调用天地图在线地理信息服务的通道，包括快速创建地图、调用地图、地名搜索以及在地图上添加覆盖物等，即和百度地图、高德地图一样。
天地图开发资源网站：http://lbs.tia...
微信小程序前端Tab切换内容代码
微信小程序常用的小交互效果，简单的tab切换，点击菜单选项，切换到对应指数的内容模块。
wxml代码
<view class="tabBtn">
<block wx:for="{{tabBtn}}" wx:key="index">
<view class="item{{curTab == index ? ' active' : ''}}" bindtap="clickTab" data...
小程序实现点击拨打电话api接口wx.makePhoneCall
在需要点击拨打电话的标签上绑定一个点击事件bindtap，代码：
<view class="call" bindtap="makeCall">拨打电话</view>
在点击事件的方法里使用wx.makePhoneCall
Page({
data: {
phone:'400 888 8888',
},
makeCall:function(){
wx.makePh...
