H5
葉幺
实在 乐于研究
展开
-
js xlsx 转json数据(叶笔记)
xlsx 转json原创 2022-02-15 11:21:45 · 1056 阅读 · 0 评论 -
nui-app 滑动条 可修改背景图片跟滑动按钮图片
nui-app 滑动条 可修改背景图片跟滑动按钮图片简单明了,可根据这个模板修改多种样式原创 2021-12-16 17:51:30 · 1016 阅读 · 0 评论 -
uni-app微信H5微信扫一扫支持安卓跟苹果
下载微信JSSDK https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/JS-SDK.html#1先登录微信公众平台进入“公众号设置”的“功能设置”里填写“JS接口安全域名”。备注:登录后可在“开发者中心”查看对应的接口权限。我这边新建一个wechat.js用于调用扫一扫var jweixin = require('@/components/app/jweixin'); // 我将下载的插件重命名为jweixin.js放在.原创 2021-02-03 09:38:43 · 2013 阅读 · 2 评论 -
jq 在当前li下添加.on移除兄弟li下面的.on 获取当前li的下标
html<ul> <li class="on">li1111</li> <li>li2222</li> <li>li3333</li> <li>li4444</li></ul>js$("ul li").click(function(){ $(this).addClass("on").siblings().removeClass('on') // 在当前li下添加.o原创 2020-11-02 09:33:13 · 824 阅读 · 1 评论 -
jq常见方法
选择父元素 $(“span”).parent();选择所有父元素$(“span”).parents();选择所有父元素的ul $(“span”).parents(“ul”);选择所有.box直接子元素$(".box").children();选择.box下面所有子孙元素 $(".box").find("*")选择.box所有的兄弟元素$(".box").siblings();选择.b...原创 2019-11-07 14:56:19 · 186 阅读 · 0 评论 -
form表单的serialize,serializeObject,serializeArray属性
今天看了同事的代码,发现form属性还有serializeObject属性,结果上网查了下,这些方法的用法首先我们统一写一个form表单<form> <input type="text" name="username" value="123"/> <input type="password" name="password" value="456"...原创 2019-10-18 09:49:15 · 1538 阅读 · 0 评论 -
pc端,移动端添加弹窗禁止body滚动
1.css.fixed{position: fixed;width:100%;} // 由于如果不填写宽100%;有些人的宽会变窄2.jsvar Top = null; // 设置Top为空$(".btn").click(function(){ // 点击弹出弹窗禁止body滚动 $(".rule_box").show() Top = $(window).scrollTop...原创 2019-10-11 15:47:14 · 383 阅读 · 0 评论 -
常见css
b{font-weight:normal} 去除b标签样式i{ font-style:normal} 去除i标签样式a{ text-decoration:none} 去除a标签样式添加阴影样式-moz-box-shadow:2px 2px 5px #333333; -webkit-box-shadow:2px 2px 5px #333333; box-shadow:2px 2px ...原创 2019-10-10 16:05:15 · 110 阅读 · 0 评论 -
pc端页面js禁止右击出现菜单
<script type="text/javascript"> function stops(){ return false; } document.oncontextmenu=stops;</script>原创 2019-08-28 09:42:44 · 431 阅读 · 0 评论 -
初用mescroll-uni
1、首先将到uni-app插件市场下载mescroll-uni https://ext.dcloud.net.cn/plugin?id=343或者去mescroll官网下载 http://www.mescroll.com/load.html?v=190725/2、将下载到的(mescroll-uni目录)复制到自己的项目中components目录下3、在页面中引入插件import Mesc...原创 2019-08-09 08:56:03 · 9209 阅读 · 2 评论 -
使用for,map,each循环分别费时多久,谁的速度更快
首页我们来测试下看看那种循环费时比较久首先我们先引入jq<script src="https://common.cnblogs.com/scripts/jquery-2.2.0.min.js"></script>第一步先创建一个数组,push100000数据 var jjj = [] for(var i=0;i<100000;i++){ ...原创 2019-07-12 12:06:58 · 1176 阅读 · 0 评论 -
weui 搜索 weui-search-bar
效果图1、首先引入css跟js<link rel="stylesheet" type="text/css" href="lib/weui.min.css"><script src='js/jquery.min.js'></script><script src='lib/jquery-weui.min.js'></原创 2018-11-30 18:16:46 · 11550 阅读 · 0 评论 -
图片固定宽高居中
效果图:1、引入jq:2、添加html部分(引用两张网上图片):<div class="box"> <div class="list"><img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1551061283&原创 2019-02-18 10:47:33 · 497 阅读 · 0 评论 -
小程序中如何将View按照百分百比,实现等宽高效果
1,首先写出布局<View className='Box'> <View className='Box1'> <View className='Box2'></View> </View></View>2、写出样式.Box{display: flex;justify-content:space-between;...原创 2019-03-14 15:26:50 · 2523 阅读 · 1 评论 -
img 显示固定部分,超过部分隐藏,不压缩,不变形
不知大家在做前端页面的时候,有没有遇到类似这样的问题:有一个不是正方形的图片,可能是宽度大于高度的,也可能是高度大于宽度的,而你又并不想用背景图的方式来做,要实现用img标签来让此图片显示出一个正方形的且不变形的效果。即如下图:只显示图片中间部分(红框部分)下面我们便来简单讨论如何实现让长方形图片显示出正方形的效果,首先我们本次讨论中用到的两张图片的原图就是上面的两张图片(一张宽度大于高度,另...转载 2019-03-19 11:10:44 · 21345 阅读 · 2 评论 -
Taro引入阿里图标
首先进阿里图标下载项目至本地下载完解压缩打开后将以下文件复制出来这边我在src下新建一个fonts目录,将上面复制下来的五个文件放到里面(目录名可以自己命名,或者放在其他目录下)返回到上级也就是src目录下打开app.tsx(或app.js)文件引入 import ‘./fonts/iconfont.css’以上就引用完icon,接下来我们来试试效果,在页面中写上以下内...原创 2019-05-20 15:40:16 · 4285 阅读 · 3 评论 -
h5可移动div draggable
1、引用jquery.min.js和jquery-ui.min.js <script src="https://cdn.staticfile.org/jquery/2.0.3/jquery.min.js"></script> <script src="https://cdn.bootcss.com/jqueryui/1.12.1/jquery-ui.min.js"...原创 2019-05-10 17:54:57 · 1406 阅读 · 0 评论 -
css object-fit实现图片居中垂直对齐不超过,不隐藏,等比缩放(实用)
效果图1、首先写下html <div class="CardNoBox"> <img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1559715393055&di=f746e03b7251ef347f7f785e8ccb9538&...原创 2019-06-05 11:38:50 · 776 阅读 · 0 评论 -
图片根据容器等比缩放并居中
1.引入JQ(这里用到JQ插件)2.写html<div class="CardNoBox"> <img :src="imgF" alt="" class="CardNoImg" id="CardNoImgF"></div>3.添加css样式,由于css样式只截取一部分,同行们可自动补全.CardNoBox { width: 92%; bord...原创 2019-05-29 17:22:01 · 1030 阅读 · 0 评论 -
突然发现css3动画是可以暂停的
今天逛下大前端发现一个好玩的东西,用css3做动画我们已经玩过很多次了吧,结果居然还可以暂停这动画,这是之前没有运到过的,话不多说上代码。首先上html代码(对就只要一个div) <div class="play-state"> 暂停 </div>2.给play-state加上样式(目前这个的效果是在鼠标移上去时停止的).play-state { ...转载 2019-06-11 15:38:32 · 1377 阅读 · 0 评论 -
css 移动端常见的字体响应
html{ font-size:100px;padding:0;margin:0;}@media(max-width:540px){ html { font-size:84.375px; } } /*Android常用宽度*/@media(max-width:480px){ html { font-size:75px; } } /*Android常用宽度*/@media(max-width...原创 2019-07-02 16:14:29 · 1404 阅读 · 0 评论 -
jq判断是否点击返回,回到上一页
<script> window.addEventListener('pageshow', function (event) { if(event.persisted || window.performance && window.performance.navigation.type == 2){ // 返回2则是点击返回 ...转载 2019-07-03 11:58:19 · 2553 阅读 · 0 评论 -
Taro固定底部切换AtTabBar
首先引入taro-ui,加入标签AtTabBarimport Taro, { Component, Config } from '@tarojs/taro'import { View } from '@tarojs/components'import { AtTabBar } from 'taro-ui'import './index.scss'标题为:个人中心,显示下标为3conf...原创 2018-11-27 10:44:46 · 12139 阅读 · 6 评论