前端
文章平均质量分 91
robin_sky
公众号:心路里程碑
展开
-
PS制作万花筒动画
学习PS是自己的业余爱好,学了之后觉得挺好玩的,但是做第二次的时候就记不住了,所以就记一下详细步骤使用工具:PSCC2014效果图: 图一 ...原创 2018-08-27 15:45:04 · 2615 阅读 · 0 评论 -
点击刷新验证码
以前自己不写验证码,也不管是怎么写的,更不考虑哪些点击刷新验证码是怎么实现的,现在需要用到这些东西,搞了好久终于搞出来了,其实挺简单的<img src="生成验证码的接口" onclick="this.src=this.src+'?'+Math.random()" id="img"><a href="#" onclick="document.getElementById('im原创 2018-05-30 15:29:25 · 11407 阅读 · 5 评论 -
微信小程序上下滚动的方法
1、不使用scroll-view组件1、查看自己代码中page的属性如果你的page样式中含有overflow属性,且属性值为hidden,将其去掉,若去不掉则加入下代码:page { overflow-y: auto !important;}2、查看自己的顶级盒子view的样式若 样式中含有display属性,且属性值为flex,将其去掉即可2、使...原创 2019-11-14 10:45:57 · 9812 阅读 · 2 评论 -
后端返回错误,前端仅刷新验证码的方式
验证码的输入框及图片代码:【使用tp5的验证码】<!-- 验证码输入框及图片 --><div class="form-group"> <div class="row"> <!-- /.col --> <div class="...原创 2019-10-30 16:43:08 · 529 阅读 · 0 评论 -
前端及PHP限制用户在一段时间内提交的次数
前端代码:<form action="" method="post"> <div class="form-group has-feedback"> <input type="text" class="form-control" name="name" placeholder="用户名" onkeyup="v...原创 2019-10-30 16:38:19 · 1987 阅读 · 0 评论 -
微信小程序背景图片无法在手机上显示
一:将图片在网站上转换为base64格式,然后再设置 【将图片转换为base64网站】http://imgbase64.duoshitong.com/.userInfo{ width: 800rpx; /*高宽大小根据个人情况自己调试*/ height: 1150rpx; background-repeat:no-repeat; /**...原创 2019-06-26 14:05:09 · 4542 阅读 · 1 评论 -
小程序分类横向滚动+内容横向滚动
效果图:wxml代码:<view class="container" ><!-- 优惠券列表的位置 --> <view class='header'> <scroll-view class='scroll_w' scroll-x scroll-left="{{scrollLeft}}"> <block w...原创 2019-06-23 21:04:34 · 6134 阅读 · 0 评论 -
layui上传图片
HTML代码:<div class="layui-col-sm4"> <label class="layui-form-label">上传图片:</label> <div class="layui-upload"> <button type="button" class="layui-btn...原创 2019-07-01 09:34:44 · 442 阅读 · 0 评论 -
layui框架中表格的操作放在工具栏
想要将操作按钮单独提出来,不放在表格中操作,网上找了很多方式都是用的table.render()方法,但是并不能解决问题,查看底层代码后发现的解决方式,亲测有效表格及工具栏的效果图:操作代码:<div id="table-list"> <div type="text/html" id="toolbarDemo" lay-filter="cou...原创 2019-09-16 14:05:58 · 1858 阅读 · 0 评论 -
微信小程序前端生成二维码
下载qrcode.js文件,下载地址:https://download.csdn.net/download/robin_sky/11829464/** * 绘制二维码图片 */ createQrCode: function(url, canvasId, cavW, cavH) { var _this = this //调用插件中的draw方法,绘制二维码图片 var ...原创 2019-09-29 15:46:35 · 4345 阅读 · 0 评论 -
小程序固定顶部,中间滚动
wxml代码:<!--pages/my_coupon/my_coupon.wxml--><view class='coupon'> <view class='header'> <view class="item {{currentTab==0 ? 'on' : ''}}" bindtap='tabChange' data-curr...原创 2019-06-11 15:55:46 · 2426 阅读 · 0 评论 -
禁止输入空格的正则
onkeyup="this.value=this.value.replace(/\s+/g,'')"<input type='text' onkeyup="this.value=this.value.replace(/\s+/g,'')" />原创 2019-05-31 14:48:16 · 9168 阅读 · 0 评论 -
阻止form表单默认提交的方法
前端代码: <form method="post" id="form" onsubmit="return false;" > <div class="form-group"> <label for="username">用户名:</label> ...原创 2019-05-17 17:43:15 · 4088 阅读 · 0 评论 -
菜鸟学习小程序之轮播图
其实小程序的轮播图比PC端的简单多了,没有那么多的js代码跟逻辑,但是对于新手的我来说还是踩了很多坑。效果图:前端代码:<!--轮播图 --> <view class='nav'> <swiper class="swiper" indicator-dots="true" autoplay="true" interval="5000" du原创 2018-06-29 18:11:03 · 3534 阅读 · 0 评论 -
菜鸟学习之picker组件【年龄,地址,星座】
在刚开始接触小程序时,自己是懵的,不知道怎么写,也不知道从哪入手,很多web端的东西在这里都行不通,官方文档也很简单,很多东西都要自己去摸索,看别人做的样式啥的都很好看,自己就尝试做了下面的界面效果图:.wxml代码<!-- start可以选择的起始时间 bindchange:value改变时绑定的事件--> <view class='infos'><text...原创 2018-07-03 15:29:43 · 1245 阅读 · 0 评论 -
点击上传图片并显示文件名和图片及获取input file的值和路径
原本的input type='file' 样式真的很丑,毫无美感而言,一直想写一个点击图片就显示的界面,现在终于研究出来了。原本的input type='file'样式:改变后的样式:样式代码: <style type="text/css"> .img{opacity:0;} .imgs{border:1px solid #78C3F3;backg...原创 2018-06-28 16:20:45 · 32527 阅读 · 8 评论 -
菜鸟学习小程序之文件上传+PHP-laravel后端代码
看到别人写的修改个人资料时点击图片就会出现文件上传窗口,但是自己折腾了很久才算做了出来.wxml文件<view class='img' bindtap="chooseimage"> <text style='float:left;' >图像</text> <image src='{{userInfo.avatarUrl}}' class='...原创 2018-07-05 18:25:24 · 1606 阅读 · 0 评论 -
菜鸟学习laravel框架之ajax请求
1、如果是form表单的,注意_token字段,form表里可以写 {{ csrf_field() }}或者<input type="hidden" name="_token" value="'.csrf_token().'"> 2、在页面上添加 <meta name="csrf-token" content="{{ csrf_token() }}&quo原创 2018-07-20 17:21:34 · 2254 阅读 · 0 评论 -
laravel框架中的多图上传
效果图:前端代码:<div class="role" onclick="file(this)"> <img src="" alt="" id="goods_1" class="file" > <span style="color: #ccc;">上传图像</span> <input type=...原创 2018-10-22 16:11:12 · 1685 阅读 · 0 评论 -
点击上传图片并显示
效果图:前端代码:<div class="role" onclick="document.getElementById('cover').click()"> <img src="" alt="" id="cover_1" class="img"> <span style=&quo原创 2018-10-22 16:20:33 · 2088 阅读 · 2 评论 -
html限制input框只能输入数字或小数及限制范围
前端代码:<input type="text" name="payMoney[]" onkeyup="clearNoNum(this)" value="" oninput="if(value>100)value=100;if(value<0)value=0">oninput="if(value>100)value=10原创 2018-11-18 10:32:45 · 19424 阅读 · 2 评论 -
TP5路由的使用及模板中url对路由的使用
TP5路由的使用:route.php中的写法访问结果:使用url()函数访问路由:在PHP中的使用方式:echo url("admin/login/login"); url("模块名/控制器名/方法名")对应的路由写作方式:Route::group('admin',[ 'login' => ['admin/login/login', ['metho...原创 2019-05-10 23:24:38 · 3565 阅读 · 0 评论 -
菜鸟学习小程序之弹窗效果
小程序现在改成了要先点击按钮才能弹出授权界面,只放个按钮感觉太丑了,就自己找资料研究出了一个弹窗,就不会觉得太丑了。效果图:具体代码:界面代码:<view class="container"> <view class="userinfo" wx:if="{{!hasUserInfo && canIUse}}" > <view class原创 2018-06-29 17:58:05 · 707 阅读 · 0 评论