博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
自动刷新 CSS文件
阅读量:5076 次
发布时间:2019-06-12

本文共 1329 字,大约阅读时间需要 4 分钟。

自动刷新 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

 

转载于:https://www.cnblogs.com/leshao/p/5834366.html

你可能感兴趣的文章
jquery datagrid 后台获取datatable处理成正确的json字符串
查看>>
ActiveMQ与spring整合
查看>>
web服务器
查看>>
网卡流量检测.py
查看>>
poj1981 Circle and Points 单位圆覆盖问题
查看>>
POP的Stroke动画
查看>>
SQL语句在查询分析器中可以执行,代码中不能执行
查看>>
yii 1.x 添加 rules 验证url数组
查看>>
html+css 布局篇
查看>>
SQL优化
查看>>
用C语言操纵Mysql
查看>>
轻松学MVC4.0–6 MVC的执行流程
查看>>
redis集群如何清理前缀相同的key
查看>>
Python 集合(Set)、字典(Dictionary)
查看>>
获取元素
查看>>
proxy写监听方法,实现响应式
查看>>
第一阶段冲刺06
查看>>
十个免费的 Web 压力测试工具
查看>>
EOS生产区块:解析插件producer_plugin
查看>>
mysql重置密码
查看>>