自动刷新 CSS文件
自动刷新 CSS文件
使用任何代码工具码 CSS,都是需要保存后再切换到浏览器按 F5 刷新查看效果,一次又一次,不管这个改动仅是一个小小的颜色。使用 CSSrefresh 后,改动 CSS 文件保存后,直接看浏览器就好了!
省去了: 切换到浏览器按 F5 刷新查看效果。这对码 CSS 习惯不停刷新查看效果的开发人员来说绝对是利器,省却的时间不是一点两点。
CSSrefresh 是一个 JavaScript 库,用来实现无需刷新页面立即更换网页样式效果的功能,即插即用无需配置,只需要在页面中引入该 JS 文件即可。
使用CSSrefresh是容易的
<head>
<link rel="stylesheet" type="text/css" href="css/site.css" />
<script type="text/javascript" src="js/cssrefresh.js"></script>
</head>
注意:js 要紧跟在 css 文件之下。
所以,我们就到官网下载这个 CSSrefresh.js文件,但是放在自己的IDE---Hbuilder工具里面不好使用
放在eclipse工具里面好使
再次证明了 “eclipse”的标准性能还是可以的!
Hbuilder是尚在发展状态,有很多未完善的,不兼容这个插件。
遂,搜索,检索,探测,询问……终得出
修改源码62行
/*return ( headers && headers[ 'Last-Modified' ] && Date.parse( headers[ 'Last-Modified' ] ) / 1000 ) || false;*/
为return ((new Date().getTime()+1000*60*60) / 1000) || false;这一行之后,就可以生效了
此版本可以放在任何开发环境,即可使用。
双屏显示下,左边显示浏览器效果,右边编辑器,右边一修改css文件,左边瞬间生效。
cssrefresh.js版本是官网下载的,使用"eclipse"开发工具的可以使用这个版本
cssrefresh-hassan.js是我自己修改的版本,便于自己开发工具使用的!
以上博文参考,摘自网络资源,自己修改的,便于自己使用。
参考链接:
http://www.oschina.net/p/cssrefresh
http://www.zhangxinxu.com/wordpress/2012/03/cssrefresh-js-automatically-refresh-css-files-%E8%87%AA%E5%8A%A8%E5%88%B7%E6%96%B0/
感谢hassan帮忙修改源码!
详情可参考链接的源码附件
有我自己修改版本的demo
链接地址:http://files.cnblogs.com/files/leshao/cssrefresh%E8%87%AA%E5%8A%A8%E5%88%B7%E6%96%B0demo.rar
自动刷新 CSS文件的更多相关文章
- 关于自动刷新CSS
由于最近系统调整大量的css,希望用户在浏览的时候能即时看到css的更改,而不是继续看到的是客户机上的缓存css. 在网络上找了下,发现很多人推荐一个叫cssrefresh的小工具. http://w ...
- gulp构建前端,压缩css,js文件,实现浏览器自动刷新
一.安装node nodejs下载地址:https://nodejs.org/ nodejs自带npm模块管理器,安装完成之后打开dos命令窗口输入 node -v就能查看nodejs是否安装成成功 ...
- gulp下livereload和webserver实现本地服务器下文件自动刷新
一.前言 node从v0.10.26升级(为了匹配autoprefixer)到v5.3.0后出现了gulp插件兼容问题,在nodejs下各种新的插件出现问题,需要重新配置.livereload实现ch ...
- gulp最佳实践(包含js,css,html预编译,合并,压缩,浏览器自动刷新)
gulp是基于流的自动化构建工具官方网址:http://www.gulpjs.com.cn/ 一.安装需要的模块 1.新建package.json,输入下面的内容 { "name" ...
- 分享Grunt.js配置: watch + liveReload 实时监测文件变化自动刷新浏览器
http://www.tuicool.com/articles/2eaQJn 用Grunt配置watch和liveReload组件,可以实时检测指定的文件变化并自动刷新浏览器.目前基本已经成为了我的必 ...
- django 调试 监控文件变化 自动刷新浏览器
问题描述:修改html js py等文件后,自动刷新浏览器,解放F5,提高效率 解决办法:使用gulp,使用bowerSync 关于gulp,可以查看系列教程 关于bowerSync,查看官网 关于结 ...
- 前端-如何用gulp快速搭建项目(sass预编译,代码压缩,css前缀,浏览器自动刷新,雪碧图合成)
一:gulp优点: 易于使用 通过代码优于配置的策略,Gulp 让简单的任务简单,复杂的任务可管理: 插件高质 Gulp 严格的插件指南确保插件如你期望的那样简洁高质得工作. 构建快速 利用 Node ...
- 2017春 前端自动化(二) 页面自动刷新、sass与css转换的使用、pxToRem直观转换
2017春 前端自动化(二) 页面自动刷新.sass与css转换的使用.pxToRem直观转换 引言: 此文要演示:浏览器页面自动刷新:移动端px与rem的转换,简单直观化:使用sass自动生 ...
- webpack 实现自动刷新,复制文件,实现开发环境和发布环境
webpack例子:https://github.com/Aquarius1993/webpackDemo 安装: webpack , webpack-dev-server 1.如何在使用webpac ...
随机推荐
- javascript设计模式——适配器模式
前面的话 适配器模式的作用是解决两个软件实体间的接口不兼容的问题.使用适配器模式之后,原本由于接口不兼容而不能工作的两个软件实体可以一起工作.适配器的别名是包装器(wrapper),这是一个相对简单的 ...
- java poi 导入日期为空
如上两图,如果是第一种的话,可以导入,,但,如果是第二种的话,导入为空查看,导入的文件,有这么一条 debugger发现 它把2017-11-01转为Double,转不了,出错了,所以,我在catch ...
- VisualStudio程序运行后控制台窗口一闪就没了
这个虽然是千查万查出来的,但也不是原创的.希望对大家有所帮助. 方案一:网上最常见的解决方案是,在程序结尾的 return 0; 之前加 system("pause") 或 get ...
- SpringBoot 整合Ehcache3
SpringBootLean 是对springboot学习与研究项目,是依据实际项目的形式对进行配置与处理,欢迎star与fork. [oschina 地址] http://git.oschina.n ...
- java 可变參数列表
Java SE5加入了可变參数列表特性 參数能够这样定义.(Object-args).可变參数用"..."来定义,args是可变參数的数组.举个样例: package sample ...
- xcode 6 改动组织及开发人员
搞个ios 开发死去活来的,各个地方说的都不一样,defaults write 不好用 在xcode6中 改动方法例如以下 改动create by __FULLUSERNAME___ 部分 Syste ...
- Ajax 请求后打开新窗口被拦截的解决方案
公司业务上有个场景,需请求后台获取支付链接地址,再打开地址引导用户购买.这样的场景在其他企业应该也很场景.但是遇到个很常见的问题,Ajax后直接用window.open(url),会被浏览器作为广告拦 ...
- Idea中右边的maven projects窗口找不到了如何调出来
关于Idea中右边的maven projects窗口找不到了如何调出来? 具体的idea版本我不太清楚,我用的是2016版,其他版本应该也是一样的. 首先idea自带了maven控件,不像Eclip ...
- iOS voip电话和sip软电话 --网络电话
一|介绍1.两者区别: SIP软电话与IP电话在技术上属于同一类型,只是SIP软电话是使用电脑软件实现的,而IP电话有一部分是在话机中直接写入了程序,可以通过硬件直接使用.IP(简称VoIP,源自英语 ...
- slowhttptest慢攻击工具介绍
slowhttptest介绍 Slowhttptest是依赖HTTP协议的慢速攻击DoS攻击工具,设计的基本原理是服务器在请求完全接收后才会进行处理,如果客户端的发送速度缓慢或者发送不完整,服务端为其 ...