这篇文章主要介绍了通过vue写一个瀑布流插件代码实例,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下 效果如图所示：采用了预先加载图片，再计算高度的办法。。网络差的情况下，可能有点卡 新建 vue-water-easy.vue 组件文件 <template><div class="vue-water-easy" ref="waterWrap"><div v-for="(items,clos) in list" :key="clos" :style="waterStyle" class="colsW"><ul><l...
这篇文章主要介绍了微信小程序页面滚动到指定位置代码实例,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下 页面上有一个元素或者组件，id 为 comment 则： var me = this;var query = wx.createSelectorQuery().in(me);query.selectViewport().scrollOffset()query.select("#comment").boundingClientRect();query.exec(function (res) {console.log(res);var miss = res[0].s...
移动端的惯性运动，最早来自 ios 的专利。用于手指滑动，离开屏幕之后，屏幕内容继续滚动。更有动态感。 这里，以 pc 端，鼠标横向（沿x轴） 拖拽的，惯性计算。移动端同理 效果代码如下 <!DOCTYPE html> <html lang="zh"> <head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><meta http-equiv="X-UA-Compatible" content="ie=edge"><title>惯性运动</title><style type="text/c...
这篇文章主要介绍了js之切换全屏和退出全屏实现代码实例,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下 应用场景:比如很多网页游戏全屏之类的，或者是网上看小说等。 核心代码: //控制全屏 function enterfullscreen() { //进入全屏$("#fullscreen").html("退出全屏");var docElm = document.documentElement;//W3Cif(docElm.requestFullscreen) {docElm.requestFullscreen()...
这篇文章主要介绍了JavaScript 截取字符串代码实例,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下 代码如下 <script>$(document).ready(function () {//下标从0开始let str = 123456789;//使用一个参数console.log(str.slice(3)) //从第4个字符开始,截取到最后个字符;返回"456789"console.log(str.substring(3)) //从第4个字符开始,截取到最后个字符;返回"456789"//使用两个参...
应用场景:比如像Eclipse这样的IDE，右击项目，出现选项，点击选项中的删除，就可以删除这个项目及其下的子目录包含文件(使用electron开发的桌面端项目多少都会用到)。 核心代码如下: /**** @param {*} url*/function deleteFolderRecursive(url) {var files = [];/*** 判断给定的路径是否存在*/if (fs.existsSync(url)) {/*** 返回文件和子目录的数组*/files = fs.readdirSync(url);files.forEach(function (file, index) {var cur...
这篇文章主要介绍了微信小程序 搜索框组件代码实例,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下 代码如下 search.wxml <view class="header"><view class="search"><icon type="search" size="18" color=""></icon><input type="text" confirm-type="search" bindconfirm="onConfirm" value="{{value}}" /><icon type="clear" size="18" bind:tap="onToggle" /></view><but...
1.方法封装（新建文件夹util，工具文件，在文件夹下创建request.js文件，用于对方法封装）request.js： var app = getApp(); //项目URL相同部分，减轻代码量，同时方便项目迁移 //这里因为我是本地调试，所以host不规范，实际上应该是你备案的域名信息 var host = http://localhost:8081/demo/;/*** POST请求，* URL：接口* postData：参数，json类型* doSuccess：成功的回调函数* doFail：失败的回调函数*/ function request(url,...
功能： 1、需要多选复选框，并且可以上拉滚动； 2、需要通过名称手写字母排序的，并且可以上拉滚动； 常规的小程序自带的原生picker无法满足我们的要求，因此一些特殊效果需要我们自定义来实现，废话不多说，我们直接看效果：index.wxml布局 <view class="container"><view class=class bgFFF bindtap=isDep><view class=class-text><text class=red> </text><text>开放部门</text></view><view class=class-choose><text class=...
这篇文章主要介绍了微信小程序 简易计算器实现代码实例,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下 只能进行简单的运算 效果图如下：cal.wxml <view class="screen">{{result}}</view> <view class="content"> <view class="buttonGroup"><button id="{{id1}}" bindtap="clickButton" class="buttonitem color1" hover-class="shadow">清除</button><button id="{{id2}}" ...
今天机试有个内容是做网易云课堂tab栏切换的，如下先简单说下我当时的想法 1.先弄一个大div盒子，我命名为tab 2.在大盒子tab里面有两个小盒子，分别是标题栏（tab_list）和内容栏（tab_con） 3.采用display：flex；使标题栏菜单和内容栏的内容水平对齐（可能待会放的代码不是很规范，但实现对齐效果） 4.js编写鼠标移入事件，主要是利用display：none和display：block之间的切换。 下面放下我当时写的代码吧，可能写得不是很正规，...
这篇文章主要介绍了微信小程序 拍照或从相册选取图片上传代码实例,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下 upload.wxml<!--pages/upload/upload.wxml--> <button bindtap=uploadPhoto>拍照选取照片上传</button>upload.js// pages/upload/upload.js Page({data: {imgData: []},uploadPhoto(e) { // 拍摄或从相册选取上传let that = this;wx.chooseImage({count: 1, // ...
其实购物车都是类似的实现方法，只不过小程序是有他的数据层和业务层，在这里把之前的做法记录一下，分享出来也希望能给需要的小伙伴带来参考价值在最开始的时候先从本地存储中获取购物车数据，因为我们会切换页面 在页面切换的过程中需要实时重新加载购物车的数据，所以我们把获取的方法写在onShow中，而不是onLoad中：onShow: function () {const cart = wx.getStorageSync("cart");let address = wx.getStorageSync("address") ...
效果如图使用了高德地图API：https://lbs.amap.com/api/javascript-api/example/marker/massmarksjs代码如下： function MapOperate() {}MapOperate.prototype.listensubmit = function () {var self = this;var submitBut = $(".submit-btn");var time_id = $("#time-id");var time_now = new Date(time_id.html());submitBut.click(function () {var btn = $(this);var data_id = btn.attr(data-id);var datas = self.format(tim...
这篇文章主要介绍了微信小程序class封装http,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下 代码如下 config.js var config = {base_api_url:"https://douban.uieee.com/v2/" } export {config}utils/http.js import {config} from "../config"; class HTTP{request(params) {if (!params.method) {params.method = "GET"}wx.request({url: config.base_api_url + params.url...