css禁止鼠标事件
最近在做一些按钮控制类的需求，从jser思维方式出发，老是根据样式或者属性对按钮触发方法做一些判断然后return掉。后来在重构兄弟的启发下，发现原来有更简单的处理方式，通过CSS的pointer-events可以简单的控制区域能不能响应鼠标事件。通过这个事件可以发现有很多原来看似复杂的js控制，都可以转变为对css样式类的控制。现在看起来，很多事情都可以换种方法，比如之前碰到的序号问题，现在碰到的按钮控制问题。复杂js的解决方案可以用简单的css解决方案来代替，不失为一种优美的思路。ps：付上pointer-events的说明，备查
css-3秒（大概吧...）快速撸出YY游戏页面（三）
轮播图部分我随便找了五张图，大家做练习的时候也随意，一图五用也OK，因为这里不涉及js，只是单讲css结构&样式详解由图可以看出我们要写的主体部分后面有背景色且上下有边距，于是我们先给一个大盒子，设上背景色和上下padding值下一级的盒子是中间的，所以加上类名gWidth这个我们之前写好的版心，顺手再加个类名clearfix来清楚浮动，因为我们里面的内容是分左右两大块浮动的先来看左边这块，这个是新闻banner轮播区域，在这里的轮播图的做法是用ulli结构，给出五个li浮动成一行，每个li里面都有一张图，那么这图张图排成了一行，如果不给ul的父盒子设置固定宽度，那么这五个图片在同一行会把这个父盒子顶得很长，给ul的父盒子设置固定一张图片的宽度且加上（overflow:hidden;）超出部分隐藏，然后用js控制没几秒ul向左移动一张图片宽度的距离还有ul这个父盒子左右两个按钮也加上事件控制其移动，JS在这里点到为止，因为在这里主要还是讲解css我们来给ul这个大长条的父盒子加一个固定宽度和高度且设置为（position:relative;）
由 Bootstrap 的媒体对象(Media object) 谈 flexbox
CSS3弹性盒子(flexbox)，是一种新的布局方式。使用flexbox，可以很方便的实现常见的布局以及居中效果。Bootstrapv4的Mediaobject也是使用flexbox来实现。flexbox相关的属性较多，本文便结合几种的情形来探讨flexbox的应用场景。Boostrapv3中的Mediaobject使用table-cell实现，新版本则采用了flexbox。table-cell是一个不太常见的属性，使用该属性主要是：1.实现两栏或者多栏布局；2.很容易实现元素垂直居中效果。v4版本使用了flexbox，完成功能的同时，相较于v3更加简洁了。下面我们来结合MediaObject介绍flexbox的相关知识。1.常见的MediaobjectMediaobject用来实现常见的两栏或者多栏布局。html片段：
关于性能优化85分的回答，好记
{"debug":false,"apiRoot":"","paySDK":"https:\u002F\u002Fpay.zhihu.com\u002Fapi\u002Fjs","wechatConfigAPI":"\u002Fapi\u002Fwechat\u002Fjssdkconfig","name":"production","instance":"column","tokens":{"X-XSRF-TOKEN":null,"X-UDID":null,"Authorization":"oauthc3cef7c66a1843f8b3a9e6a1e3160e20"}}
从 webpack 到全面拥抱 Parcel #1 探索 Parcel
所以值得一探！官方地址：https://parceljs.org/github地址：https://github.com/parcel-bundler/parcel介绍这个库之前，我们来说一下我个人觉得webpack的一些不好的地方（相对于Parcel）。需要写配置文件（webpack.config.js），可能每使用一个功能，比如加载图片或css，都要添加配置，要维护配置文件，而Parcel不需要。感觉编译或加载速度有些慢，特别是库多或项目复杂的时候，虽然有一些办法代码拆分的方法可以解决，比如CommonsChunkPlugin或DLLPlugin之类的，但这些方法有些复杂。需要一定的时间去学习如何使用webpack。而Parcel有很多优点，可以不使用配置文件，也就是说你只管写代码，它会自动运行，很智能化，打个比方吧，比如在webpack中如果要处理css，那得要安装和加载一个css的loader，然后配置文件写上几行，可是Parcel不需要，直接用就行。Parcel学习起来比
JQuery实现弹窗下底部页面禁止滑动【原创】
在项目开发过程中，经常会遇到带有弹窗的页面，尤其是在移动端。在没有特别要求的情况下，弹窗弹出后，弹窗下的底部页面依然能够滑动。为了得到更好的用户体验，需要做到触发弹窗时，弹窗底部页面禁止滑动，关闭弹窗时，弹窗底部页面恢复滑动，具体思路如下：1.触发弹窗时，获取滚动条所在的位置。2.将底部页面的position属性设置为fixed。3.设置底部页面的位置为触发弹窗时的初始位置。4.关闭弹窗时，恢复底部页面的position属性。5.恢复底部页面的滚动条高度。//触发弹窗底部页面禁止滑动functionfixed(){varscrollTop=document.body.scrollTop;//设置背景元素的位置$('#content').attr('data-top',scrollTop);varcontentStyle=document.getElementById("content").style;//content是可以滚动的背景元素id名称contentStyle.position='fixed';
webpack3实战（5）打包一个多页、jQuery、图片转base64、压缩混淆、异步模块加载的项目
入口：设置入口文件；出口：设置打包后的文件夹以及文件命名；babel-loader：用于将es6、es7等语法，转换为es5语法；css-loader：用于处理css文件（主要是处理图片的url）；style-loader：将转换后的css文件以style标签形式插入html中；postcss-loader：一般用于添加兼容性属性前缀；less-loader：以less语法来写css；url-loader：用于将图片小于一定大小的文件，转为base64字符串；file-loader：url-loader不能转换base64字符串的文件，被这个处理（主要用于设置打包后图片路径，以及CDN等）；html-withimg-loader：用于加载html模板；html-webpack-plugin：用于将已有html文件作为模板，生成打包后的html文件；clean-webpack-plugin：用于每次打包前清理dist文件夹CommonsChunkPlugin：提取chunks之间共享的通用模块3、技术难点3.
开发 | 小程序做动画效果难？送你一个框架，10 分钟就能搞定
原标题：开发|小程序做动画效果难？送你一个框架，10分钟就能搞定在小程序中使用canvas绘制图案、动画的难度有目共睹。除了本身写法繁琐，小程序的技术特性，也使得小程序无法使用普通HTML5的canvas框架，进行图案、动画绘制。而今天，知晓程序就来为你推荐一款框架。这款框架专为小程序设计，它可以让你在小程序里，更轻松地完成图案绘制，还能使用事件响应。想知道用它在小程序创建动画有多炫酷吗？往下看就知道了。关注「知晓程序」公众号，在微信后台回复「开发」，让你的小程序性能再上一层楼。文|bobiscool它是什么？Canvas（画板）是HTML5的一个重要元素，它能够高效的绘制图形。但是它过于底层，且API粗糙，导致开发者很难使用它来做较为复杂的图形。而且它的即时绘制无记忆特性，使得它内部的图形并不支持动画更不支持一切交互事件。这样的问题出现在所有支持canvas的客户端上，微信小程序也不例外。而且，由于小程序由JScore支持，并没有window
canvas 从初级到XX 1# 部分非基础原生API的使用 [初级向]
标题canvas从初级到XX，XX是因为本文随机都可能会太监，并不会支持到入土。请慎重的往下看。对于canvas的介绍，随处都可以找到，也就不啰嗦太多了。就直奔主题了。先看一段代码，以及实现的效果吧。drawing(canvas,[80,40,30,20,20])其实，准备使用下面的代码，然后大家看的时候，刷新页面就有不同的效果的，但是由于博客不能插入js，就无法实现这个预想了。等最后给大家介绍完毕之后。可以使用这个代码来看一下效果。ps：如果有大神可以私信、留言告诉我，怎么在博客中插入js。我会十分感激的。1varcanvas=document.getElementById('drawing')2vararr=[]3for(vari=Math.random()*7+3;i>=0;i--){4arr.push(Math.random()*100)5}6drawing(canvas,arr)好了。现在让我们进入真正的正题吧。绘制前的分析绘制canva
关于本地存储
本地存储只能查看当前域名所属信息知识点Cookie信息有效期，所属域名路径SessionStorage和LocalStorage可以存储任意字符内容Storage的存储容量比Cookie的容量更大，H5开发中很常用Cookie和Storage都支持查看，增加，修改，清除Cookie存数的数据，当过期日期小于当前日期，择自动删除SessionStorage存储数据在关闭浏览器之后就没了LocalStorage存储数据可以长期保存，没有截止有效有效期//写入CookievaraddCookieBtn=document.getElementById("addCookieBtn");addCookieBtn.addEventListener("click",function(){document.cookie="imooc"+"="+escape("test");content.innerHTML=content.innerHTML+"
"+"Cookie写入完成";});//=================
Spire.Doc 教程：如何在C＃中设置word 脚注的位置和数字格式
脚注位置可以在每个页面的底部或文本下方。脚注的默认数字格式是“1，2，3”，以下示例显示如何通过调用Section.FootnoteOptions的属性来设置脚注的位置，数字格式和重新启动规则。首先，查看MicrosoftWord下的脚注选项和原始示例文档文件：Step1:创建文档的新实例并从文件加载文档Documentdoc=newDocument();doc.LoadFromFile("Sample.docx",FileFormat.Docx2013);Step2:从文档中获取第一部分Sectionsec=doc.Sections[0];Step3:设置脚注的数字格式，重新启动规则和位置sec.FootnoteOptions.NumberFormat=FootnoteNumberFormat.UpperCaseLetter;sec.FootnoteOptions.RestartRule=FootnoteRestartRule.RestartPage;sec.Footnote
Visual Studio和VS Code中的Rust
DanielGriffen发布用于VistualStudio的Rust语言服务插件预览版。该插件要求在VisualStudio2017Preview中使用，VS2017Preview是实验性版本，用于测试新的VS功能特性。这并非第一次有人为VisualStudio开发Rust语言插件。六个月前，AndrzejJanik和PatrickReisert就开发了一个叫作VisualRust的项目。这次不一样的地方在于，DanielGriffen使用了Rust语言服务器（RLS）。基于语言服务器协议，Rust语言服务器被设计成与编辑器无关的语言服务。这意味着他们针对VisualStudio或VSCode所做的改进都可以被应用在Sublime、emacs、vim和其他编辑器上（这些编辑器仍然需要提供与语言服务器进行交互的适配插件）。RLS使用了Rust编译器和Racer。Racer即Rust自动完成器，准确度比完整的编译器要低，但性能更好。所以，在编译器速度慢的地方（比如代
每天一道CTF（16） JarvisOJ RE Classical CrackMe2 （多图）
做完了ClassicalCrackMe1是不是不太过瘾？那再来一题吧。https://dn.jarvisoj.com/challengefiles/CrackMe2.rar.6886f4141bedfb27a2dd0d3dcc4f38f9题解这题是一个.Net程序，一开始用IDA调了半天，啥都看不出来，上网找了一下，发现有个调试工具dnSpy，可以动态调试.Net程序。首先用dnSpyx86打开这个程序，看见入口点：进入入口函数，看见一个奇怪的类：点进去，发现类初始函数中又调用了一堆奇怪的函数，关键点在这里前一个是加密，后一个是判断。在第一处下断点，可以通过读取bytes数组的值，得到key。然后再在第二处那个判断text2相等的函数末尾下断点，可以得到密文。通过AES-ECB解开，得到flag：这题主要收获的就是认识了一个新工具dnSpy，很好用。
DevExpress XtraScheduler日程管理控件应用实例（1）-- 基本使用
在一些应用场景中，我们可能需要记录某一天，某个时段的日程安排，那么这个时候就需要引入了DevExpress的日程控件XtraScheduler了，这个控件功能非常强大，提供了很好的界面展现方式，以及很多的事件、属性给我们定制修改，能很好满足我们的日程计划安排的需求，本文全面分析并使用这个控件，希望把其中的经验与大家分享。1、日程控件的表现效果整个日程控件，可以分为日视图、周视图、月视图等等，当然还有一些不常用的时间线、甘特图等，本例我们来关注控件的使用以及这几个视图的处理。先来看看他们的界面效果，如下所示。日视图：在视图里面，默认可以打开响应的日程事件进行编辑的。周视图：月视图：2、日程控件XtraScheduler的使用我们在上面展示了这个控件的几个视图的界面，一般情况下的控件使用还是很方便的，也就是直接拖拉SchedulerControl到Winform界面即可，但是我们为了符合我们的使用需求，还是需要设置不少属性或者事件的处理的。1）几种视图的切换由于控件，默认也是提供右键菜单，
我和廖总的新项目：Wildfire 野火评论系统 ：-D
Wildfire野火评论系统是我和@mrliao共同开发的一个评论系统，你可以将它添加到你的个人博客网站（Hexo博客等）或者其他网站给它们提供评论功能。经过很长一段时间，终于有足够的信心发布出来公开测试。希望这个评论系统大家会觉得有用。请尽情提出改进需求，我们会一直维护它直到它成为一个稳定、成熟的项目。欢迎贡献代码！EnglishDoc|中文说明文档如果你的网站需要一个方便的评论系统的话，不妨试试Wildfire野火评论系统。“星星之火可以燎原”。——阿利盖利·但丁，《天堂》注意：点击查看在线示例http://chengkang.me/wildfire链接使用方法功能截图使用方法1.设置数据库幻灯片：如何为Wildfire设置Firebase数据库？幻灯片：如何为Wildfire设置Wilddog数据库？(待创建……你可以参考上一个幻灯片，二者设置步骤差不多，相信你能搞明白！:-D)2.将Wildfire添加到你的网站上请看看这个幻灯片：如何将
可能是最全的Vue-TypeScript教程(附实例代码和一键构建工具)
Vue-TypeScript-DpApp-Demo功能轮播搜索列表懒加载简单动画loadingvue-router.tsvuex.tsvue-class-component使用vuex-class使用xxx.d.ts声明文件基于类的编写方式mock数据tsconfig.jsonwebpack配置vue-typescript-cli项目地址：https://github.com/SimonZhang...完成后的简单例子基于类的写法加上静态类型检查，简直不能再嗨<scriptlang="ts">importVuefrom"vue";importComponentfrom"vue-class-component";import{State}from"vuex-class";@ComponentexportdefaultclassShopsextendsVue{@Stateshops:StoreState.shop[];@State
scrapy 爬妹子图
classMeizituSpider(CrawlSpider):name="meizitu"host='http://www.meizitu.com/'start_urls=['http://www.meizitu.com/a/sexy.html']headers={'Accept':'text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8','Accept-Language':'zh-CN,zh;q=0.8,en-US;q=0.5,en;q=0.3',}defparse(self,response):nextPage=response.xpath(u'//div[@id="wp_page_numbers"]//a[text()="下一页"]/@href').extract_first()nextPage=self.host+nextPageforpinresponse.xpath('//li[@class="wp-item"]//
[TsAdmin]--一款基于Vue.js+Element UI的单页无刷新(无iframe)多选项卡的后台管理系统模板
前言很高兴今天在这里跟大家分享一款全新的后台管理系统UI模板--TsAdmin.TsAdmin是图享网自主开发的一款基于Vue.js+ElementUI的单页无刷新(无iframe)多选项卡的后台管理系统模板，截图如下：TsAdmin中主要集成了以下的优秀功能：一、无限递归的左侧菜单支持无限级递归的菜单树，你只需要提供格式规范的JSON数组对象即可，如：[{title:'系统设置',name:'1systemsettings',expand:true,uniqueNo:'1systemsettings',children:[{title:'首页',name:'首页',path:'/homepage',allowClose:false,uniqueNo:'homepage',children:[]},{title:'仪表盘',name:'仪表盘',path:'/dashboard',uniqueNo:'dashboard',allowClose:true,
vue-cli脚手架工具开发总结
写在前面：在基本不懂后台，不会打包工具的前提下，完成了一个基于vue-cli的spa音乐播放器后，决定做一些总结(纯入门)，以下总结是针对刚学习vue和使用cli工具的。项目地址一、安装配置1.1首先保证安装了node1.2然后全局安装vue-cli，建立项目npminstall-gvue-cli//全局安装//使用vueinit创建基于webpack模板的项目vueinitwebpackvue-demo//vue-demo为项目名cdvue-demo//安装成功后进入项目npminstall//安装项目的依赖1.3安装成功以后，使用npmrundev运行项目就能看到官网的例子了下面简单看下项目结构：--build//项目构建(webpack)相关代码||--build.js//生产环境构建代码||--check-version.js
采用Opserver来监控你的ASP.NET项目系列(二、监控SQL Server与Asp.Net项目)
前言之前有过2篇关于如何监控ASP.NETcore项目的文章,有兴趣的也可以看看.今天我们主要来介绍一下,如何使用Opserver监控我们的SQLServer和ASP.NET项目的异常监控监控效果如下:SQLServer的:ASP.NET异常情况的监控:监控SQLServer首先我们来讲解一下如何监控我们的SQLServer.上篇内容我们已经提到过Opeserver的项目有很多的配置文件.我们找到我们的SQLSettings.example.json文件,改名为SQLSettings.json文件修改其中的配置项如下:/*ConfigurationfortheSQLServerdashboard*/{"defaultConnectionString":"","refreshIntervalSeconds":30,"clusters":[{"name":"192.168.1.120","refreshIntervalSeconds"