- 博客(53)
- 收藏
- 关注
RSS订阅原创 微信小程序中自定义修改Swiper组件的面版指示样式【学习记录】
如果你的swiper是component组件，在swiper.wxss里面写.wx-swiper-dots和.wx-swiper-dot样式是不会生效的，一定要在父组件的.wxss里面写！可根据自己需要可以自定义.wx-swiper-dot和.wx-swiper-dots样式实现自己想要的样式，一起加油。实现解决方案，自定义indicator-dots样式。...
2022-08-02 09:37:34
904
转载 【微信小程序实现悬浮框可拖动】
微信小程序实现小图标悬浮拖动移动在电商平台常见的开发中，或多或少的设计图中都会牵扯到小图标悬浮的设计，当图标可以移动时，可增加页面的设计排版灵活性，下面贴出效果图JSWXMLwxss图标素材下载地址：...
2022-06-13 11:12:43
1756
1
转载 微信小程序根据API接口wx.chooseLocation获取省市区
在开发过程中我们会遇到根据定位获取当前地址，同时快捷的获取到省市区信息，但是微信小程序的api接口wx.chooseLocation只会返回完整的地址信息，这时候根据返回的地址信息获取档期内地址的省市区信息，获取方法如下 //获取定位 intoMap:function(){ var _this = this; wx.chooseLocation({ success: function (res) { console.l
2022-03-22 17:02:28
3046
2
原创 微信小程序瀑布流布局纯css样式
最近发先我们ui设计师很喜欢这种瀑布流设计图，在日常开发中，应该会有小伙伴需要这样的瀑布流样式布局的商品列表，今天整理出相关的代码，如有需要可自取，效果图如下，如遇问题评论留言。wxml <!-- 商品列表 --> <view class="fourth_all_goods"> <view class="fourth_congoods flex-b"> <view class="twoshop-shop-box" wx:
2021-06-24 14:43:45
746
2
原创 js截取银行卡尾号
js 截取银行卡尾号var cardNo=’6212*********999999‘var lastNo=cardNo.substring((cardNo.length-4),cardNo.length)console.log(lastNo)
2021-03-29 15:24:36
459
转载 微信小程序删除数组中指定的一个或多个对象
var addTableData = [ { id:1, count:1 , price:1}, { id:2, count:2 , price:2}, { id:3, count:3 , price:3}, { id:4, count:4 , price:4}];var delTableData = [ { id:1, count:1 , price:1}, { id:2, count:2 , price:2}];for (var i=0; i<addTa
2020-12-08 19:55:21
3858
原创 微信小程序中适配iphoneX或适配 iPhone 11/Pro及以上的机型的兼容性
今天做一个功能，需要兼容iphoneX系列以及11.12以上的设备的兼容性，由于微信小程序在适配iphone x 的时候 底部的横线会出现遮挡如图：于是乎就翻了翻小程序的API文档，果不其然在小程序基础接口里面有提供接口wx.getSystemInfo(Object object)那么接下来我们讲解下在小程序的开发中我们怎么使用？1、在全局的app.js文件中globalData我们创建全局变量，然后获取设备型号 globalData: { isIphoneX: false,/
2020-12-08 19:51:58
6996
3
原创 微信小程序中适配iphoneX兼容性
今天做一个功能，需要兼容iphoneX系列以及11.12以上的设备的兼容性，于是乎就翻了翻小程序的API文档，果不其然在小程序基础接口里面有提供接口wx.getSystemInfo(Object object)
2020-12-08 19:46:17
1816
原创 微信小程序switchTab传参以及接收参数
在微信小程序开发的过程中，难免会遇到switchTab传参这种情况，下面记录下处理方式，希望所有帮助描述功能场景比如从index.wxml页面跳转到tabbar中的log.wxml页面习惯性的传参方式如下wxml wx.switchTab({ url: '/yb_mingpian/pages/newIndex/newIndex?is_first_login=1', });js接收参数也是如下onLoad:function(e){ console.log (e)}
2020-10-28 17:47:58
9376
3
原创 微信小程序点击按钮聚合动画
微信小程序点击按钮聚合动画效果如下wxml<view class="allimgs"> <image src="qst_img/999_1.png" class="img-style" animation="{{animCollect}}" bindtap="collect"></image> <image src="qst_img/999.png" class="img-style" animation="{{animTranspond}}
2020-10-22 15:57:20
882
原创 移动端无缝滚动效果
移动端无缝滚动HEML<div class="t-new-scroll" style="position: relative; " id="ul1"> <ul class="ul1" style="position: absolute;overflow: hidden;"> <li> <div> <img src=...
2019-11-25 15:46:17
282
转载 移动端软键盘监听（弹出，收起），及影响定位布局的问题
参考链接：https://blog.csdn.net/qq_33834489/article/details/80450950移动端软键盘监听（弹出，收起）参考链接https://www.cnblogs.com/hity-tt/p/7095714.htmlhttps://www.cnblogs.com/hefenghefeng/p/7003152.html?utm_source=itdad...
2019-11-02 17:42:47
610
原创 移动端弹出层之后 禁止下面内容滚动
$('#n_agree').on('click',function(){ $('.n_agreement_pop').show(); $('.mod').show(); // 主要是下面这些 $("body,html").css({ "height":"100%", "overflow":"hidden" });})$('.n_agreement_pop i ,...
2019-11-02 16:10:06
580
原创 css3 图片旋转360度动画
html<div class="n_animation_picture"> <img class="n_picture_adm" src="../image/pt_bg_guang.png" /> </div>css/* 图片旋转动画 */.n_animation_picture{text-align: center;}@-webkit-ke...
2019-09-24 17:12:39
1916
原创 input标签 number类型输入框清除上下加减按钮
<input type="number" value=''> <style> input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { -webkit-appearance: none; } input[type="number"]{ ...
2019-08-31 14:10:16
1590
原创 input标签type为number时如何去除加减按钮效果
我们在使用input type = number 时 只想输入数字时 会出现如下图所示的效果 显然这不是我们想要的只需要我们简单把css样式改变下即可/* 谷歌 */ input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { -webkit-appearance: none; appearan...
2019-07-17 11:29:51
4237
翻译 table表头css写法
html<div class="box_table"> <div class="myTable"> <table class="myThead " > <thead> <tr class="fff"> ...
2019-07-16 10:46:27
2271
原创 jq代码中的ios兼容问题
一个点击事件如果点击不了的话，就是在ios手机上点不动，没反应的话，可以在点击的class上加一个 ：cursor： pointer； 让他变成一个小手，或者下面这样js中不能这么写：$(document).on('click','dom',functionn () {})应该直接：$(dom).click(function () {})dom : 是当前点击的dom元素...
2019-06-28 20:08:55
1455
原创 去除input ,textare 系统默认样式
去除input textare 系统默认样式input{ outline: none; -webkit-appearance: none; /*去除系统默认的样式*/-webkit-tap-highlight-color: rgba(0, 0, 0, 0); /* 点击高亮的颜色*/}textare { outline: none; -webkit-appea...
2019-06-28 20:07:00
471
原创 H5 ios移动端，键盘收起以后页面不缩回
h5页面嵌入APP 混合开发 监听键盘收起事件 和弹出事件 document.body.addEventListener('focusin', () =>{ //软键盘弹起事件 console.log("键盘弹起")})document.body.addEventListener('focusout', () =>{ //软键盘关闭事件 console.log("键盘收...
2019-06-28 20:04:53
1462
转载 js获取当前域名、Url、相对路径和参数以及指定参数
一、js获取当前域名有2种方法 1、方法一 var domain = document.domain; 2、方法二 var domain = window.location.host; 3、注意问题 由于获取到的当前域名不包括 http://，所以把获取到的域名赋给 a 标签的 href 时，别忘了加上 http://，否则单击链接时导航会出错。二、获取当前Url的4种方法...
2019-05-31 16:03:54
134
原创 jq 导航栏吸顶
html<div class="head"> 11111</div><div class="ggg" style="height:1000px;"> 11111</div>jsdocument.onscroll = function(){ var scrollTop = window.pageYOffset || docu...
2019-05-14 15:41:17
365
原创 js控制点击div以外空白处小时
$(".menu_level1 li").click(function(){ $(".menu_level2").show(); }); $(document).click(function(e){ var target = $(e.target); if(target.closest(".menu_level1").lengt...
2019-04-27 17:54:44
416
原创 js实现复制功能
html<div class="ywjl_why"> <span> <input type="text" value="http://www.1238.com " readonly></input> <em class="copy">复制链接</em> </span> </div>...
2019-04-27 17:19:09
183
翻译 vue 引用vant area组件
下面是改变值的时候写入<template> <div class="app"> confirm 点击右上方完成按钮 一个数组参数，具体格式看下方数据格式章节 cancel 点击取消按钮时 change 选项改变时触发 参考Picker 实例，所有列选中值，当前列对应的索引 <van-cell-group>...
2019-04-25 11:02:39
3949
转载 h5页面调用微信JS-SDK分享到微信好友或者朋友圈的配置
引入jS <script type="text/javascript" src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>在页面添加配置 <script type="text/javascript"> var url = location.href; ...
2019-04-25 10:39:01
8038
原创 模拟select下拉输入
先贴效果图html<template> <div> <div class="ck_drop" @click="arrowDown()"> <p title="请选择">{{unitName}}</p> <input type="hidden" name="unit" v-model...
2019-04-18 11:55:56
229
原创 导航栏吸顶效果
html仅实现导航吸顶效果（第一种）<div class="member_top" :class="navBarFixed == true ? 'navBarWrap' :''"> <qdd-icon class="icon-shezhi fr mr40" color="#fff" size="0.84rem"></qdd-icon> ...
2019-04-17 18:10:26
1213
原创 vue 父组件往子组件传图
子组件<template> <div class="default_null_good pr" v-show="isShowTip" v-bind:style="{background:'url('+ bg+') no-repeat center 4rem'}"> </div></template><script> ...
2019-04-12 09:59:46
1914
原创 JS 加载到最底部
页面加载完成之后 滚动到当前页面最底部 window.function(){ $('#bigbox').scrollTop( $('#bigbox')[0].scrollHeight ); }
2019-04-11 09:51:33
1686
原创 美化input=checkbox 复选框样式
HTML<div id="input-check"><input type="checkbox"class="input_check" id="check02"><label for="check02" class="mr10"></label><./div
2019-01-27 16:52:56
856
转载 等号（=），双等号（==）还有三等号（===）的使用与区别
1.一个等号（=）$a = 1;表示把1赋值给变量啊echo $a ; //输出 12.双等号（==）$a = null; $b = ''; $c= 1;双等号表示等于 echo ($a==$b)?1:0; //输出1 echo ($a==$c)?1?0;//输出03.三等于（===） $a = null; $b = ''; $c = 0; $d ...
2018-11-01 13:22:28
17068
原创 检测是否是微信浏览器
&lt;div id="zhezhao"&gt;&lt;/div&gt;&lt;script&gt; $(function(){ // 检测是否是微信 var ua = window.navigator.userAgent.toLowerCase(); if(ua.match(/MicroMessenge
2018-10-25 15:57:22
158
原创 css3图片上下浮动动画
ctype html><html lang="en"><head> <meta charset="UTF-8"> <title>图片上下浮动</title> <style> * { padding: 0;
2018-10-13 13:34:37
8261
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人