- 博客(111)
- 资源 (15)
- 收藏
- 关注
RSS订阅原创 【css】Dark-mode 在web的处理方案
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <meta name="x5-fullscreen" content="true" /> <meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport">.
2020-10-13 14:42:06
357
原创 【第三方 分享】网页第三方分享
0、通用流程常规为跳转一个第三方的地址（微信内的网页除外，走的是jssdk），带上必要的参数：appid、分享链接、分享图片、分享标题、分享内容等等（根据不同平台支持的内容不同，链接、文字等均需要进行encodeURIComponent后再拼接到链接上，微信内网页除外）1、微信分享只有在微信里的网页有，为和app分享出来作区分，一般称为二次分享（1）申请公众号填写资料，并去公众号完...
2020-01-22 15:37:25
785
原创 【第三方 授权】网页第三方授权
0、通用流程（1）去第三方填写必要的材料，申请获取需要的信息（比如appid，appsecret等），如果需要打通app和网页应用（或多个网页应用之间打通），也需要去指定地方申请打通（2）通过第三方提供的sdk，或者我们自己的一个中转网址，跳转到第三方的网址并带上指定的参数（3）第三方网址通过网址参数，得知我们应用身份，用户登录第三方的账户后，第三方会带上参数回调到我们的回调网址（4）在...
2020-01-22 15:35:46
1874
原创 【Facebook分享】网页针对Facebook分享做爬虫优化（开放图谱标签）
App分享到Facebook在2019年政策上有了变化，将无法再通过指定分享的标题、描述、图片等，而是提供了在被分享的网页链接上加上特定的标签供Facebook的爬虫抓取来（Facebook称为开放图谱标签）。<meta property="og:url" content="https://dev.demo.com/test.php" /><meta property="...
2019-03-28 14:04:03
1847
2
原创 【react-natvie】react-native Android webview下h5使用rem布局会随系统字体放大缩小的解决方案
问题描述：react-native Android webview下h5使用rem布局会随系统字体放大缩小Android普通浏览器里，在浏览器直接调整字体大小（例如UC、QQ浏览器等都支持改变浏览器里字体大小），h5使用rem布局会随浏览器设置的字体放大缩小由于Rem布局本身已经考虑到了不同机型/浏览器/分辨率的适配问题，这个时候再随系统字体、浏览器字体放大缩小就会造成布局的混乱，所以...
2019-03-22 17:22:35
2039
原创 【微信 小程序/小游戏】微信小程序/小游戏 相关政策 和 踩坑总结
1 小游戏提交时需要比小程序更多的资料微信官方运营规范：https://developers.weixin.qq.com/miniprogram/product/#%E4%B8%89%E3%80%81%E5%B0%8F%E6%B8%B8%E6%88%8F%E7%89%B9%E5%88%AB%E8%A7%84%E8%8C%83...
2018-05-23 16:03:29
891
原创 【微信分享】微信分享 踩坑 和 相关政策 总结
本文主要介绍网页微信二次分享中楼主踩过的坑，希望对大家有所帮助，之前写过的相关微信分享的文字这里指一下路：微信分享 使用weixin js sdk 兼容 旧版本【微信分享】 微信分享集成 使用weixin js sdk 兼容 旧版本 2【cordova ionic2 微信分享】使用 cordova-plugin-wechat 做微信分享的注意点微信官方文档指路：微信JS-SDK说明文档坑1：公众号...
2018-03-31 22:17:15
1654
原创 【编码】使用JavaScript做中文编码转换
背景：用git bash跑curl命令的时候，会碰到中文无法输入or无法正常工作的情况，这里介绍先把中文转码，就可以正常使用了。这里介绍JavaScript的方法：1 在url地址上的GET参数是中文时，使用console.log(encodeURIComponent('上海'));2 放在body里面，以-d带的参数中有中文时，（常用于POST和PUT方法），使用var s = '上海';va
2018-01-18 18:13:19
3101
原创 【编码】使用php做中文编码转换
背景：用git bash跑curl命令的时候，会碰到中文无法输入or无法正常工作的情况，这里介绍先把中文转码，就可以正常使用了。这里介绍php的方法：1 在url地址上的GET参数是中文时，使用echo urlencode('上海');2 放在body里面，以-d带的参数中有中文时，（常用于POST和PUT方法），使用$array = array( 'name' => '管理员', 'pass
2018-01-18 18:06:39
1221
原创 【react-native】react-native Windows+Android 安装并运行起来第一个demo
如何成功运行React-native官网第一个demo（Windows + Android）如果你跟着官网每一步走，然后发觉打包起来还是红色的界面，那么看下面的文章会对你有所帮助（楼主自己找到的正确的道路，官网少写了一步）1https://facebook.github.io/react-native/docs/getting-started.html这个页
2017-12-08 11:36:21
299
原创 【cordova】cordova安装步骤（mac）
官方安装文档地址：http://cordova.apache.org/#getstarted1 安装nodejs（已经安装了的请跳过这一步）nodejs官网https://nodejs.org/en/可以去官网下载最新安装包，然后按步骤安装2 打开终端Finder -》 应用程序 -》 实用程序 -》终端输入nod
2017-12-01 11:20:51
2143
原创 【cordova】cordova安装步骤（windows）
官方安装文档地址：http://cordova.apache.org/#getstarted1 安装nodejs（已经安装了的请跳过这一步）nodejs官网https://nodejs.org/en/可以去官网下载最新安装包，然后按步骤安装安装完毕后，打开cmd，输入node -v可查看node版本输入np
2017-12-01 11:16:31
3551
原创 【cordova ionic2 微信分享】使用 cordova-plugin-wechat 做微信分享的注意点
cordova-plugin-wechat在github的地址：https://github.com/xu-li/cordova-plugin-wechat主要常用功能：检查是否安装微信(window).Wechat.isInstalled(installed => { if (installed) { // todo when installed } el
2017-11-30 11:59:59
6882
6
原创 【微信 video】微信 video 踩坑记录
前提介绍：iOS中微信的浏览器内核应该是和Safari浏览器同样的内核Android中微信的浏览器内核是腾讯自己开发的X5腾讯浏览服务（Android上的QQ浏览器也是这个内核）1 内联播放视频iOS上给video标签增加playsinline和webkit-playsinline（兼容新版旧版），对于在Safari中可以内联播放的，那么在微信中也是内联播放的Andro
2017-11-29 17:35:49
1059
原创 【Ionic2】Ionic2 踩坑记录
之前已经写过2篇相关的文章了，这里在把遇到的坑的细小的点也记录一下：之前的两篇文章：1 【Ionic】Ionic打包编译时内存溢出问题2 【Ionic】Ionic Android 打包 Crosswalk报错问题的解决方案这里要记录的坑：1 安卓6.0时，Push跳页面报错，报错的信息如下：Expression has changed a
2017-11-07 17:31:54
972
原创 【css3】js条件下多次触发同一个css3动画的解决方案
本文适用于非循环播放动画，而是条件下触发播放动画的解决方案通常，我们会写一个css3的动画作为一个样式，在需要播放动画的时候把样式加到元素上播放一次如果需要多次触发播放动画，如果是使用将样式先去掉再马上加上的办法，将无法多次播放动画这里介绍一下解决方案 Animation Test html,body,div,p{ marg
2017-09-18 17:15:58
4444
1
转载 【国际化】Android包的国际化
app在桌面上显示的名称随系统切换中英文，而对应显示app的中文名称和英文名称{project_path}/platforms/android/res下有values文件夹，这个为默认需要做中英文国际化时，将values文件夹多复制出两份，分别命名为values-zh，values-en然后将values-en中strings.xml中app_name的
2017-09-18 15:06:47
488
翻译 【Ionic2】Ionic2 Android 打包 Crosswalk报错问题的解决方案
问题描述：使用ionic build android打包编译时，遇到报错说crosswalk的有个文件访问不到了，具体如下FAILURE: Build failed with an exception.* What went wrong:A problem occurred configuring root project 'android'.> Could not res
2017-09-04 18:48:15
1218
原创 【css】css文本换行与溢出显示为省略号
1 强制换行word-wrap: break-word;2 单行文本溢出时显示为省略号text-overflow: ellipsis;white-space: nowrap;overflow: hidden;+width,height根据需要设定3 多行文本溢出时显示为省略号（仅webkit内核支持，手机端可尝试，android和ios默认浏览器都为we
2017-08-29 17:29:15
463
原创 【Ionic2】Ionic2打包编译时内存溢出问题
问题描述：使用ionic build android --prod打包的时候报了内存溢出的错误FATAL ERROR: CALL_AND_RETRY_LAST Allocation failed - JavaScript heap out of memory（不加prod的时候不会内存溢出）解决方案：运用v8引擎的旧属性: --max_old_space_size 来修
2017-08-29 17:16:30
3060
原创 【video】video使用踩坑记录
1 普通网页上，ios视频不能内联式播放如果是web app，cordova（ionic）中，首先给video标签加playsinline和webkit-playsinline（兼容新版旧版不同的浏览器）config.xml中加2 ios视频不支持autoplay和preload，如需自动播放，需要在页面加载后通过js调用播放视频3 对于视频而言，可能需要播放前
2017-08-29 11:36:28
3807
1
原创 【整理】web前端相关知识文档手册整理
中文文档合集印象中文https://www.docschina.org/综合类W3CSchoolhttp://www.w3school.com.cn/MDN Web 文档英文版（Mozilla）https://developer.mozilla.org/en-US/MDN Web 文档中文版（Mozilla）https:/
2017-08-23 15:21:59
353
原创 【js】Input事件
Input Event常用事件触发的先后顺序如下：1 keydown2 keypress3 textInput4 input5 keyupkeydown，keyup1 全部浏览器支持2 当用户按下/释放键盘上的任意键时触发3 event.keyCode，返回键盘上按键对应的特定键码（兼容性：分号在Firefox，Opera上返回的是ASC
2017-08-18 16:09:41
1907
原创 【JS技巧】JavaScript技巧介绍1 -- switch
switch1 switch条件为数字时，可以使用数组mapvar fun0 = function(){ console.log('fun0');}var fun1 = function(){ console.log('fun1');}var fun2 = function(){ console.log('fun2');}var condition =
2017-04-21 10:49:33
332
原创 【手机UI】搜索输入框，呼出软键盘时右下角为搜索按钮，并使用js发送请求
搜索 window.onload = function(){ document.getElementById("J_search_artical").onsubmit = function () { var title = document.getElementById("J_search_content").value; alert('title:'+ t
2017-04-20 18:15:09
4027
原创 【文件上传 后端】文件上传 后端 Part2 —— base64文件流方式
<?phpfunction response($arr){ switch($arr['code']){ case 200: $code_str = "OK"; break; case 201: $code_str = "Created"; break; case 400: $code_str = "Bad Request"; break; c
2016-09-29 12:03:12
1127
原创 【文件上传 后端】文件上传 后端 Part1 —— 文件指针方式
<?phpfunction response($arr){ switch($arr['code']){ case 200: $code_str = "OK"; break; case 201: $code_str = "Created"; break; case 400: $code_str = "Bad Request"; break; c
2016-09-29 11:56:52
652
原创 【文件上传 前端】文件上传 前端 Part3 —— HTML5 文件流方式
upload file3 - h5读取文件流$('body').on('change','#J_upload_btn',function(){ var source = $(this).get(0), file = source.files[0]; var ireg = /image\/.*/i, file_type = file.type, file_nam
2016-09-29 11:49:21
5168
原创 【文件上传 前端】文件上传 前端 Part2 —— HTML5 文件指针方式
upload file2 - h5传文件指针$('body').on('change','#J_upload_btn',function(){ var source = $(this).get(0), file = source.files[0]; var ireg = /image\/.*/i, file_type = file.type, file_nam
2016-09-29 11:41:33
689
原创 【文件上传 前端】文件上传 前端 Part1 —— 传统表单上传
upload file1 - 传统表单 传统表单上传文件的方式代码非常简单，但是有以下几个点需要注意：1、由于表单中包含文件，所以需要加上 enctype="multipart/form-data" 这个，使得浏览器在发送请求的时候，自动解析为name对应的字段，并给表单各个部分加上boundary2、input type="file" 的name需为和后端
2016-09-29 11:29:11
2111
原创 【微信bug解决方案】微信 Android js reload失效 解决方案
如果你不幸踩到了微信浏览器中，js调用window.location.reload();完全没有效果这个坑，那么看看以下的解决方案将能帮你出坑如果你问过了度娘，那么会看到这样的解决方案，使用window.location.href = window.location.href，楼主亲测是没有效果的，另一种是在地址后面再加一个随机数或者时间戳比如var date_obj = ne
2016-09-22 15:29:29
4640
原创 【js】js获取地址中get参数
如果你同时使用多种开发语言做web开发，那么就会发现，js对于获取地址中get参数是没有官方的方法的，而php里则有非常便捷的$_GET['aaa']非常简单的方法这里写了一个简单的方法，能使js也能简单的获取地址上的get参数function get_query_str(){ var location_url = window.location.href; var paramet
2016-09-22 15:11:38
2697
原创 【第三方登录】第三方登录 Part1 —— QQ登录（2016-09最新版）
由于楼主是web开发方向，所以这里就介绍一下web接入qq登录的方法，以及和app的qq登录打通的方法0、前提已经有一个在工信部备案过的域名的网站，具体可以查询工信部的备案页面（请注意这里的信息很重要，会影响之后qq登录申请时的资料填写）工信部查询域名备案的网址：http://www.miitbeian.gov.cn/publish/query/indexFirst.actio
2016-09-12 11:46:00
5285
原创 【js】js判断数据格式
/* * 判断数据类型 * * is_str(source) 判断是否为字符串，source传递的是需要判断的变量 * is_num(source) 判断是否为数字，source传递的是需要判断的变量 * is_fun(source) 判断是否为函数，source传递的是需要判断的变量 * is_obj(source) 判断是否为对象（包括数组），source传递的是需要判断的变量
2016-06-23 14:58:56
1480
原创 【css 效果】边沿打孔的优惠券
项目中用到了这个边沿打孔的效果，尝试下来使用纯css写的这个样式，在这里分享一下：效果大致如图分步实现思路：1，先画两个带圆角的框，A和B（A、B分别需要加投影效果，图上没有做）2，在B的左右两条缝隙的地方分别画一排圆（其实是正方形用了50%的圆角），圆填充色和背景色相同（此处背景色是白色，所以圆的填充是白色）3，给圆
2016-06-23 14:30:05
7667
原创 【IE Cache】IE浏览器造成的请求Cache问题 的解决方案
对于普通的静态文件，html、css、js和图片文件而言，是希望浏览器进行缓存，以便再次访问时直接从浏览器获取，减少请求。对于其它的js请求而言，如果被浏览器缓存了，而不能实时获取到最新的数据是让人抓狂的事情。IE浏览器就有这样一个设定：对于响应头（Response Header）中，没有明确表明是否缓存（强制缓存或者强制不缓存），IE浏览器默认的设置是“自动 automa
2016-05-25 14:11:46
3780
原创 【整理】查看市场份额常用权威网站
1 浏览器市场份额（可切换全球和中国，以及可按pc及移动端查看）http://gs.statcounter.com/2 友盟指数（中国的安卓，iOS系统版本份额、品牌份额）http://www.umindex.com/3 苹果官网iOS系统分布数据https://developer.apple.com/support/app-store/4 Andr
2016-05-16 11:36:17
30600
原创 【PHP PDO】纯PHP（不使用框架）下 Mysql PDO 使用方法小记
1 配置信息$config = array( 'db' => array( 'host' => '127.0.0.1', 'user' => 'root', 'pass' => '', 'db' => 'test_db', 'dns' => 'mysql:dbname=test_db;host=127.0.0.1;charset=utf8' ))
2016-05-06 12:02:30
7015
原创 【整理】前端实用插件整理（附官网地址）
以下是楼主亲测好用的一些前端插件的整理1 WebUploader文件、图片上传插件（带图片预览，兼容ie），可以自定义UIhttp://fex.baidu.com/webuploader/getting-started.html2 iSlider手机图片预览插件，可以支持左右滑动翻页，手势放大缩小，手机长按保存https://github.com/B
2016-05-05 18:06:30
1802
js条件下多次触发同一个css3动画的解决方案demo
2017-09-18
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人