分类 html5 下的文章

最近公司的某产品中,有动态热图的展现,分别展现某个时间段的热图时间变化,例如:最近一周七天内,每天的热图分布变化图;客户提出一个需求,这个动态变化的图生成一个gif图提供下载是否可行?

实现方案:

1.可通过服务端生成对应gif,然后前端请求下载
2.前端自己实现生成gif图片,自行下载


- 阅读剩余部分 -

关于placeholder的使用,众所周知它是h5的新属性,所以IE9以下就别想用它了,不支持。

那么我们必须要低版本的浏览器,做一些降级处理的兼容,原理自然就是:提示语placeholder用其他方式替代显示咯。

以下是一小段兼容处理。

代码如下(jquery请自行引入):

- 阅读剩余部分 -

最近项目中遇到一个令人头疼的问题,查阅各种资料,尝试各种方法,最终得以解决;哎···下面就说说这心酸的历程吧。

大家都知道autocomplete属性是表单字段中的HTML5新属性,该属性有两种状态值,分别为"on" 和 "off",该属性可省略:省略属性值后默认值为"on",也可以省略属性名,直接写入关键字on或off。

网站项目中,有登录和注册的弹框,在除chrome的浏览器中一切都ok,一旦在谷歌浏览器中,问题来了:

- 阅读剩余部分 -

placeholder占位符文字,也可以设置对应的颜色,透明度等样式,具体如下:

/*placeholder字体颜色*/
::-webkit-input-placeholder { /* WebKit browsers */
    color:#ccc;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
    color:#ccc;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
    color:#ccc;opacity:1;
}
:-ms-input-placeholder { /* Internet Explorer 10+ */
    color:#ccc !important;
}

- 阅读剩余部分 -

最近,移动端的项目越来越多,每个项目中都有登录注册界面等,异常提示的弹框和tip用的较多,
于是抽出点时间封装了下对应的jquery插件,和一个函数;以便项目重用性。
废话不多说,直接上代码:



- 阅读剩余部分 -

项目中有用到iScroll做移动端滑动效果的,里面有input复选框<input name="" type="checkbox" value="">组件;
此时出现了,点击复选框不起作用现象。
原因:由于iscroll要监听鼠标事件和触摸事件来进行滚动,所以禁止了浏览器的默认行为
解决办法如下,由于iScroll5和4源码变化较大,所以处理方式有点不同,但是大致解决办法是一样的:




- 阅读剩余部分 -

在仪表盘的任务增多同时,列表页的百分比圆环或圆饼也随之增多,于是顺手在仪表盘的基础上,封装了一个小小的jquery插件(jq-canvaspercent.js),暂且版本1.0吧,到以后业务的变化在对其进行功能拓展;
暂时性用于页面中有多处百分比圆环的效果处理,还是不错的。


- 阅读剩余部分 -

由于最近工作中,经常会遇到一些动态百分比的仪表盘,一开始都是用图片样式方式实现;
但是随着越来越多的项目,决定用canvas绘制一个简易的仪表盘,便于以后项目中直接使用;
现版本只是书写为方法形式,也许之后会有时间对其优化为插件形式。



- 阅读剩余部分 -