
web前端
文章平均质量分 67
MR_Teen
专注前端开发,是全栈开发的信奉者和实践者。执着做事,遇事不怕事。代码托管 https://github.com/noonhorse
展开
-
Tab切换5种方法
原文:http://zhanfeng.blog.51cto.com/6109904/1017901李老师用了三天的时间把Tab切换的效果讲给我们,感觉从中学到了很多很多,李老师的讲课一如既往的棒,从他身上学的的不仅仅是技术,更多的是思想。通过Tab切换我们学到:函数,数组,for循环,if语句,this关键字。其中this关键字是最重要的,this关键字第一层含义就是指向当前对象。转载 2012-10-31 23:48:10 · 7580 阅读 · 0 评论 -
jquery 焦点轮转背景图片消失, css 在作怪!
先贴上代码 然后再指明原因 :(注意 改代码 以及修改正确)/* banner */#banner{ width:100%; height:306px;float:left;}#banner .showimg{width:100%; height:300px;float:left;position:relative;}#banner .showimg .pic{width:100%;原创 2012-08-21 13:19:46 · 1664 阅读 · 0 评论 -
Nivo Slider for jquery and wordpress plugin
Nivo Slider 为jquery 和wordpress 打造的多种焦点图切换方式插件Nivo slider :官方地址:http://nivo.dev7studios.comdemo 样式 地址:http://nivo.dev7studios.com/demos/下载地址:http://nivo.dev7studios.co翻译 2012-08-27 11:52:45 · 1089 阅读 · 0 评论 -
jquery image scroll 图片无缝滚动
//调用方法 $('.scorll_ar_left').bind('click',function(){imagescroll('.itemlist','right',3,500);});//独立后的图片滚动,先用着后面有时间了再来优化 function imagescroll(parent,Orient,number,time){ var p=$(parent),c原创 2014-03-21 15:48:39 · 1391 阅读 · 0 评论 -
Reactjs相关实例学习【Reactjs】
虽然React.js 在2013年就出来,而且还有facebooke 给背书,在github上面也比较活,因为之前一直在做电商的项目,都是pc端完了然后弄个手机端,所以只是知道了解相应的东西,没有具体的接触,现在时间相对多一点了,开始慢慢实践相关的技术。后面会慢慢的讲到:React、Angular、Vuejs 并且可能会有相关实例对比(尽管已经有很多了)首先推荐几篇比较好的文章:React.js相关原创 2016-09-05 21:02:56 · 644 阅读 · 0 评论 -
前端开发中常见模块规范
commonjs 规范主要是正像服务端(后端)的模块规范,尤其是在nodejs发展起来后得到快速发展。原创 2016-10-21 15:14:04 · 620 阅读 · 0 评论 -
webP兼容性前端处理方法
上一篇 【webp简介】兼容性来自于【ISUX -Hahn 的文章 WebP 探寻之路】根据对目前国内浏览器占比与 WebP 的兼容性分析,大约有 50% 以上的国内用户可以直接体验到 WebP,如果你的网站以图片为主,或者你的产品基于 Chromium 内核,建议体验尝试。假如你打算在 App 中使用 WebP,除了 Android4.0 以上提供的原生支持外,其他版本以及 iOS 都可以直接使用原创 2016-09-27 16:25:17 · 13754 阅读 · 4 评论 -
一个新的图像格式 -- webp介绍
简介WebP是google开发的一种旨在加快图片加载速度的图片格式。图片压缩体积大约只有JPEG的2/3,并能节省大量的服务器带宽资源和数据空间。是现代图像格式,提供了优越的无损和有损压缩的图片在网络上。使用WebP,网站管理员和web开发人员可以创建更小、更丰富的图像,使网页更快。 WebP无损的png图像小26%。WebP有损图像是25 - 34%小于等效SSIM质量指数可比JPEG图像无损We翻译 2016-08-18 10:14:23 · 11036 阅读 · 0 评论 -
在线的CSS 3D Web图形编辑器 -- Tridiv【css 3D】
css 网站分享系列利用最新的CSS技术,配合支持的浏览器,你可以轻松的在线创建、浏览并保存管理Web 3D图像。Tridiv是一个基于 Web 的免费编辑器,使用 CSS 创建 3D 图像,直观且容易操作,不需要多余的教程即可轻松上手,并且可基于Local Storage保存管理你创建的3D图像。网站标语:Making 3D in CSS has never been easier 网站地址:h原创 2016-09-28 14:31:29 · 1821 阅读 · 0 评论 -
visio studio code 简介
Visual Studio Code (简称 VS Code)是由微软研发的一款免费的、轻量级的Web集成开发环境,且开源的跨平台文本(代码)编辑器,能运行在Linux、Mac 、Windows系统上。在智能提示变量类型,函数定义,模块方面继承了visio studio的优秀传统,在断点调试上也有不错的表现。前言之前一直用 sublime text,它的 插件 很丰富上手快觉得蛮好的,但是收费为70原创 2016-12-16 09:40:58 · 17904 阅读 · 0 评论 -
Android 设备WebView远程调试
声明:本文主要介绍chrome 的inspect 实现的远程调试。要求 Android 4.4 (KitKat) 以上并能开启webview渲染,chrome 版本 32++(建议最新版本)。大部分内容来自谷歌开发者网站,部分图片来自老版本的chrome,但大体上一样。 如果低于上面的硬件要求可以通过weinre来调试,详情见文章。https://segmentfault.com/a/1190原创 2017-04-17 23:08:04 · 8478 阅读 · 2 评论 -
airbnb Javascript的eslint配置
Aribnb JavaScript 风格指南关于EslintEslint是识别和报告模式匹配的工具,它的目标是保证代码的一致性和避免错误,说白了就是用来检测代码风格的。在中大型项目中对维护项目的规范性、健壮性、可读性尤其有用。配置原则我们依据以下三条原则,研读了 ESLint 所有的配置项,定制出了心目中「完美」的 ESLint 配置。能够帮助发现代码错误的规则,全部开启配置不应该依...原创 2019-01-15 07:40:33 · 2196 阅读 · 0 评论 -
session/cookie机制
面试经常为问到这个问题,cookie和session的区别以及其原理。session 会话Session是服务器生成并存储的对象,该对象用于存储特定用户会话所需的属性及配置信息。sessino介绍【深入理解HTTP Session】cookiecookie是储存在用户本地终端上的数据。某些网站为了辨别用户身份、进行session跟踪而储存在用户本地终端上的数据(通常经过加密)。cookie原创 2016-09-16 16:54:19 · 552 阅读 · 0 评论 -
【gulp.js】中大型项目构建发布实例
Gulp.js 是一个自动化构建工具,开发者可以使用它在项目开发过程中自动执行常见任务。Gulp.js 是基于Node.js 构建的,利用Node.js 流的威力,你可以快速构建项目。一、项目简介本文针对中大型cms项目(项目文件超过1.2G,静态资源类大小800MB)进行测试gulp.js的相关能力,结果如下:gulp简单易用,但在处理大量文件是性能消耗明显,cpu比较稳定,内存消耗较小无明显波原创 2016-06-28 11:00:58 · 1510 阅读 · 0 评论 -
css 滤镜 的应用
css设置透明层用下面的样式表定义你的层 .alpha { filter: Alpha(Opacity=50, FinishOpacity=50, Style=0, StartX=0, StartY=0, FinishX=100, FinishY=100}解释:Opacity=开始的不透明度(100的话就不透明了) FinishOpacity=结转载 2012-11-05 12:02:47 · 607 阅读 · 0 评论 -
计算机开放端口问题
在做开发时,有时候我们会给iis 设置站点的访问端口,但是在本地调试的时候会出现下面的这个问题。在chrome 和firefox 中出现: 错误 312 (net::ERR_UNSAFE_PORT):未知错误。我经常做站点配置,很少出现这样的错误,今天配置一个6000 的端口发现了这个错,网上查了一下,这个端口有其他用途,也就是说已经被占用了,所以,我换成了8000 网站ok 了,原创 2013-01-18 10:06:23 · 1230 阅读 · 0 评论 -
ie6/7要逆天 text: empty text node 问题
前言: 在ietester 里面用debugbar查看文档代码,每个ul li里面都有这个 text: empty text node 这个东西,有的在span 里面,在……,反正一句话,li下面肯定有,有时候还不止一个,一般情况下都没什么问题,今天逆天的遇到了, text: empty text node 用layout看到,他居然有个高度,还不是li的高度,比li显示的高度要高4p原创 2013-05-26 13:33:02 · 2079 阅读 · 0 评论 -
windows7 安装node.js
我本以为很难,看了很多的文章,不足很复杂,但是这么久了,microsoft 官方和node.js 官方合作,退出了简单的傻瓜式安装工具第一步:到node.js官方下载安装包 http://nodejs.org/ ,现在版本V0.10.13 直接点击 INSTALL 下载 msi安装第二部:检查安装情况:开始-->运行-->cmd -->查看node版本:node -v -->查看npm原创 2013-07-24 12:05:51 · 855 阅读 · 0 评论 -
cookie的读写以及前后端操作
cookie 相关操作原创 2015-12-23 17:34:32 · 19005 阅读 · 0 评论 -
ie浏览器强制开启怪异模式(Quirks Mode)的解决方法
用户没有强制开启怪异模式可以用以下方法解决1、Doctype 检测 并设置对于一个 HTML 页面,< !DOCTYP >声明位于其中最前面的位置,处于< html >标签之前,这个< !DOCTYP >可以告知浏览器使用哪种 HTML 规范,针对每种规范浏览器同样也会选择对应的文档模式。平时最常见的三种 doctype 信息对应的文档模式如下。 当 doctype 信息如下时,表明该页面是遵守原创 2016-04-07 18:38:20 · 8382 阅读 · 0 评论 -
【css属性之cursor】 光标自定义
1、定义 cursor 属性规定要显示的光标的类型(形状)。2、可能的值 下列表格来自 w3school , 这里重点说明一下url 的用法,其他的用法参考事例页面 –> 梦之都的博客网站 值 描述 url 需使用的自定义光标的 URL。注释:请在此列表的末端始终定义一种普通的光标,以防没有由 URL 定义的可用光标。 default 默认光标(通常是一个箭头) a原创 2016-04-08 12:20:34 · 9710 阅读 · 0 评论 -
【JSHint解读一】JavaScript的静态代码分析工具
简介JSHint是一个社区驱动用来检测JavaScript代码中错误和潜在的问题在和执行团队的编码规范工具。它非常灵活,因此可以很容易地适应您特定的编码规则和你的代码执行环境。JSHint将永远保持开源的方式。目标这个项目的目标是帮助JavaScript开发人员编写复杂的程序而不用担心拼写和语言陷阱。 当开发者自己开发代码库时不会因为简单的标点符号和错误没有展示出来而被迫停止执行浪费时间去调试代码原创 2016-06-08 17:27:47 · 4283 阅读 · 0 评论 -
【JSHint解读二】 jshint 配置解析
本节将详细讲述jshint的文件中配置参数以及其含义,检查目录匹配与过滤,报告生成讲解等。原创 2016-06-08 18:18:25 · 3109 阅读 · 2 评论 -
【chrome开发者工具介绍】评估网络性能
本文为chrome官网,开发者工具简介译文 ,原文见文末连接NetworkNetwork选项卡: 记录应用中的每个网络操作的信息。包括详细的时间数据、HTTP请求和响应头、cookie、WebSocket数据等等。 Network面板可以帮助您分析web应用程序的网络性能,如: 哪些资源所加载最慢? 哪些资源需要最长的时间负载(持续时间)? 谁发起的网络请求? 在特定资源翻译 2016-06-28 19:36:08 · 1081 阅读 · 0 评论 -
【fis3学习】中大型项目构建发布实例
FIS3 , 为你定制的前端工程构建工具 解决前端开发中自动化工具、性能优化、模块化框架、开发规范、代码部署、开发流程等问题。fis内置不少的功能和插件,比gulp.js体积更大功能也更丰富,主打前端构建开发的和发布等流程一体化处理。最早接触fis是在14年,那时还是fis,功能和新能还有比较多的问题,但是和fis3的改动不大。fis扩展有不少独立的运行版本如yog的php项目版面,pure的纯原创 2016-06-29 08:56:49 · 2578 阅读 · 0 评论 -
博客迁移通知
在这里好多年,也发了很多文章,来鹅厂后,很长一段时间没有坚持更新,现在下定决定,在腾讯云社区坚持更新。现将博客迁移到腾讯云社区。欢迎查阅https://cloud.tencent.com/developer/column/78054吐槽现在广告太多,页面太乱了。...原创 2019-07-03 22:01:15 · 350 阅读 · 0 评论