故障现象： 微信浏览器分享时提示「onmessage:wx.updateAppMessageShareData is not a function」错误，导致页面分享都失败。分享出去的只有一串网址。 故障分析： 一般提示这个首先考虑的是微信JS SDK没有引入导致。 但是本次案例不是这个原因，所以才分享出来，希望大家碰到这个问题时少走弯路。 相关微信分享代…

问题现象： -webkit-line-clamp样式在IE上无效，怎么改都不起作用。本来设定为3行，可是都能显示N行，在Chrome下正常。 问题分析： -webkit-line-clamp本身就是针对webkit浏览器的样式，-webkit开头的样式代码都是只针对webkit内核的样式。使用时都应该考虑兼容性问题。IE下无效，避免页面在IE下出现错位问题…

故障现象： 最近在写判断是否小程序环境的代码，发现自己直接复制网上的代码，跳进了一个坑里去了。 导致出现的故障为：修改后的页面在IE浏览器里完全不正常了，JS都没有执行了。 现在把跳坑和填坑的经历分享出来。其实也不算是坑，怪自己没注意看代码，直接复制过来就用的原因吧。 下面是网上照搬的源码： <script src=https://res.wx.qq…

需求： H5和PC端的页面需要加载Google Adsense的广告并显示。微信小程序环境下不加载广告，因为微信小程序环境下加载Adsense代码会提示「域名非法」的问题导致整个H5页面无法在小程序里打开。 分析： 分析发现，Google Adsense的代码，是需要引入JS文件的，引入Adsense的JS代码后，就会自动执行并iframe一个页面，这个页…

前言： 使用Kindeditor编辑器的应该知道，默认的Kindeditor编辑器不带插入哔哩哔哩视频的功能的，本文作用就是讲解如何自己添加一个这样的插件。 添加完成后效果： kindeditor添加插入哔哩哔哩视频教程： 1、添加编辑器工具栏图标样式 首先修改themes\default\default.png文件（如果你使用其他theme的话，…

需求： 根据用户电脑屏幕分辨率自适应缩放网页，整个页面级别的缩放。不影响视觉效果。全部使用CSS完成，不需要JS介入。 代码： @media screen and (min-width: 1366px) and (max-width: 1599px) { body { transform: scale(1.1); transform-origin: t…

需求： 美化HR标签，看起来不土。但是不要太浪费时间去调整。没有美工，纯CSS自己设计完成。 第一款HR标签CSS代码： /*内嵌水平线*/ hr.style-one { width: 80%; margin: 10px auto; border: 0; height: 0; border-top: 1px solid rgba(0, 0, 0…

前言： 在写table样式时，默认的太土，老板要求「高大上但是又要简洁」，你说碰到这样的老板，UI都没有的情况下，只能靠自己的抽象能力去写CSS了。好在让我找到了一个不错的表格CSS。让老板满意了： 完整CSS样式代码： .art_content_body_c>table { border-collapse: collapse !important;…

前言： <blockquote>引用标签不知道大家用过没有，用过的应该知道默认的引用样式比较一般。美化下老板看了会喜欢的。特别是一些有内容输出的页面。需要引用内容的时候，使用漂亮的引用标签会让人极度舒适。 最终效果： 相关代码：.art_content_body_c blockquote, .post-content blockquote {…

需求： 修改H5页面的顶部菜单，原来是因为内容比较多，需要分成两行展示。现在改成一行显示，一行显示不下的，采用横向滚动的方式左右滚屏显示。必须用flex布局 分析： flex布局下写这个挺方便的。小菜一碟 代码： 父类样式代码： ul.flex-center { width: 100%; overflow-x: scroll; overflow-y: hi…

1、添加plugins/bockquote/bockquote.js文件。代码如下KindEditor.plugin(bockquote, function (K) { var self = this, name = bockquote; self.clickToolbar(name, function () { var lang = self.lang…

需求： 判断当前的网页页面是否滚动到顶部/底部了。 代码： $(document).ready(function() { $(window).scroll(function() { if ($(document).scrollTop()<=0){ alert(滚动条已经到达顶部为0); } if ($(docum…

需求： 让a标签变灰不可点击。 代码： 前端开发中常用的css样式代码之灰色不可点击样式代码：<a href=# style=pointer-events: none;cursor: default;color:gray;>点击</a><a href=#>点击</a> 代码分析： css中a标签没有disab…

上一篇： uni-app初学教程三：运行第一个项目和页面简介-前端开发-天下网吧 uni-app创建一个页面很简单，上一篇我们讲到了页面的作用和对应的文件关系。今天实例操作创建一个页面。 以下是一些基本知识：uni-app中的页面，通常会保存在工程根目录下的pages目录下。每次新建页面，均需在pages.json中配置pages列表；未在pages.j…

要说这个「问题」是个「问题」？其实根本算不上问题。事情究竟如何，且听笔者娓娓道来： 问题现象： weui 中的 wxml-to-canvas 如果css 使用绝对定位的话就报错  官方demo 加了定位也报错 ，相关代码： 问题解决方法： 原来是忘记加双引号了，js里面的代码其实是把css属性的值当做字符串处理的，估计作者以为是在c…

上一章： uni-app初学教程二：uni-app工程简介，目录结构和工程注意事项-前端开发 今天继续，咱们先把上一章创建的这个项目，运行起来看看效果： 点HB（HBuilderX编辑器）菜单栏的运行->运行到浏览器->选择Chrome（没有安装的话安装一个） 随后HB开始准备编译和正式编译运行项目（根据机器配置不同，编译所需时间也不一样…

今天根据官方的uni-app介绍结合自己动手创建第一个uni-app项目：HelloWorld。 一、先来看看官方关于uni-app工程简介和目录结构的介绍吧： 工程简介 一个 uni-app 工程，就是一个 Vue 项目，你可以通过 HBuilderX 或 cli 方式快速创建 uni-app 工程，详见：快速上手。 #目录结构 一个uni-app工程，…

在当代做前端开发应该绕不开uni-app uni-app是一套完整的高效的多端开发框架。 天下网吧了解到，目前使用uni-app开发的用户非常庞大，各类招聘APP上招聘前端或多或少会提到需要了解/熟练/精通uni-app的开发。 天下网吧为此推出uni-app开发教程。 今天是讲最基础的：uni-app开发规范 官方的介绍：开发规范为了实现多端兼容，综合考…

现在看到一些网吧网站开始投放Google Adsense广告了，但是一些广告样式在移动端不那么好看，因为Google Adsense广告默认在移动端会占满整个手机屏幕，查看前端代码可以看到，Google Adsense广告代码默认是获取手机屏幕宽度，然后设置广告width就是屏幕宽度的值的。所以整个广告的宽度就会占满整个手机屏幕。。 其实google ad…

如果你有接到过前端看图功能的需求，那么你应该有了解或者使用过鼎鼎大名的viewer.js，这在gitcode上有6000多星的开源项目。作者是陈凤元。在github上也是有6.4k的star，是个非常不错的开源项目！ 但是在网上很多文章里公布的github站点到国内的镜像，如下： mirrors / fengyuanchen / viewerjs · Gi…

大家都知道，chrome浏览器目前是浏览器的老大。这个可能对于网吧人了解得不多。因为在国内，各种国产浏览器（比如360，QQ，搜狗）占住了主流，可能大家不知道，这些浏览器现在基本都是使用chrome的内核。在IE主流年代，他们采用的是微软IE的内核，随着IE进入退休模式，现在基本都是chrome的天下了。 就在最近，chrome发布了新版本，新版本号进入3…

本批处理是解决Steam登陆慢的问题专门编写。原理是修改hosts文件让相关域名指向离大陆最近的位于中国香港的服务器IP地址。 灵感来自天下网吧小程序用户的分享： 一招解决最近网吧steam 登录慢问题_网吧技术 大家知道修改Hosts文件可以让指定的域名直接用指定的ip来访问，而steam大陆登陆慢就是跟域名指向的IP太远导致访问慢，甚至不能访问。…

写在前面 本节将介绍如何使用Android Studio开发Android APP，和前面Eclipse + ADT + SDK搭建Android开发环境一样，本节也只是介绍一些基本东西，深入的，比如快捷键，小技巧等会再另一篇文章中详细地介绍！ 1.下载Android Studio 官网下载：Android Studio for Window .…

官方通知摘录如下为优化用户体验，平台将于2021年5月20日之后不再提供“小程序打开App技术服务”，为避免影响小程序线上服务及用户体验，请开发者及时对小程序进行开发调整，避免回收后影响服务流程。这就代表，以后小程序里无法拉起APP啦 各位且行且珍惜吧！ 目前没有办法破局哦。 …

比如你记住了某个网页的密码 但是忘记了密码，换台机器重新登陆需要密码的时候咋办呢？ 使用chrome的F12来调试一波搞定： 如上图，密码都是星号，怎么找到明文密码呢？ chrome按F12进入调试模式，点选Elements页。 选定密码框 把input type=password里面的password改为text类型，这样就显示原明文密码啦： …

做微信小程序的老铁都知道4.13号开始wx.getUserProfile要正式上线了，很多老的项目需要修改登陆逻辑，如何最简单的，代码改动最小的方式修改代码来实现新旧版本兼容，优雅的完成升级呢？一起来看看下面的一个方案： 先简单介绍下这个升级方案的逻辑吧：wxml文件改造：新增个getUserProfile的微信登陆入口。使用canIUseGetUserP…