webkit内核浏览器在设置元素overflow:scroll的时候
滑动页面会不流畅
可以尝试加入以下代码解决
{
-webkit-overflow-scrolling: touch;
}
实际上，Safari用了原生控件来实现，对于有-webkit-overflow-scrolling的网页，会创建一个UIScrollView，提供子layer给渲染模块使用。
4
22
2015
22
2015
[css3]背景图片容器自适应高度
通常我们在做自适应图片的时候,会设置img标签宽度100%,高度auto
<style>
img{
width: 100%;
}
</style>
<img src="">
但如果遇到是标签背景图的时候标签无法做到通过背景图片自适应撑开高度
我们可以利用background-size : contain;和padding-bottom来实现
<style>
div{
background: url() no-repeat;
background-size: contain;
width: 100%;
height: 0;
padding-bottom: 100%;/*这里的取值取决于图片比例*/
}
</style>
<div></div>
这个方法的技巧点在于通过控制padding-bottom和width的比值,来控制div的显示比例
例:
假如图片尺寸是宽100px * 高60px
width是100%
height保持0
padding-bottom设置为60%
5
20
2010
20
2010
[博客转移]本博客转移至blog.wagada.com
使用is-programmer一年多,感觉非常不错,非常喜欢代码高亮功能
但因为自己对博客功能的要求越来越多,这里已经无法满足我了
决定转移至新地址blog.wagada.com(最后还是投靠了WordPress,呵呵)
这里的文章将留作备份
4
26
2010
26
2010
[工具]发现一个超强IE测试工具Internet Explorer Collection,涵盖所有版本IE
不是像IETest那样集成到一个里面,而是不同的快捷方式,不同的浏览器窗口
而且还自带了Developer Toolbar
无话可说了 赶紧下载吧!
http://fileforum.betanews.com/download/Internet-Explorer-Collection/1217189605/1
http://utilu.com/IECollection/
2
24
2010
24
2010
[JavaScript]window.open控制设置了名字的子页面不刷新的方法
当window.open()指定了第二个参数name的时候,会固定显示出一个子页面,但是每次点击的时候都会自动刷新子页面
我最近做了一个聊天页面,如果再次点击打开聊天页的按钮会刷新了子页面,页面的聊天记录等数据就会全部消失 下面的代码解决了这个问题 a.html b.html refresh_me.html
<input type=button onclick='window.open("b.html","b","width=600,height=300");' value='openB' />
<iframe name="b" src="refresh_me.html" style='display:none'></iframe>
page B
<script>
window.name="b";
window.top.name="";
</script>
5
20
2009
20
2009
[CSS]让ie6也支持min-height
只要在样式里面这样定义高度就行了
min-height:120px;
_height:auto !important;
_height:120px;
_overflow:visible;
4
10
2009
10
2009
[windows xp]无法批量打开多个文件的解决方法
这几天突然发现一次选中多个mp3无法右键打开,查了半天,最后在国外的一个网站上找到了方法
打开注册表 HKEY_CLASSES_ROOT\*\shellex\ContextMenuHandlers 先导出一份作为备份reg 然后一个一个的删除下面的项目 删一个试一次批量打开 最终找到是哪个项目的问题 然后还原全部 再删除有问题的项目
1
20
2009
20
2009
[JavaScript]颜色渐变代码
//颜色渐变方法
function fadeColor( from, to, callback, duration, totalFrames) {
//用一个函数来包裹setTimeout，根据帧数来确定延时
function doTimeout(color,frame) {
setTimeout(function() {
try {
callback(color);
} catch(e) {
JSLog.write(e);
}
}, (duration*1000/totalFrames)*frame);
//总持续秒数/每秒帧数*当前帧数=延时(秒)，再乘以1000作为延时(毫秒)
}
// 整个渐变过程的持续时间，默认为1秒
var duration = duration || 1;
// 总帧数，默认为持续秒数*15帧，也即每秒15帧
var totalFrames = totalFrames || duration*15;
var r,g,b;
var frame = 1;
//在第0帧设置起始颜色
doTimeout('rgb(' + from.r + ',' + from.g + ',' + from.b + ')',0);
//计算每次变化所需要改变的rgb值
while (frame < totalFrames+1) {
r = Math.ceil(from.r * ((totalFrames-frame)/totalFrames)
+ to.r * (frame/totalFrames));
g = Math.ceil(from.g * ((totalFrames-frame)/totalFrames)
+ to.g * (frame/totalFrames));
b = Math.ceil(from.b * ((totalFrames-frame)/totalFrames)
+ to.b * (frame/totalFrames));
// 调用本frame的doTimeout
doTimeout('rgb(' + r + ',' + g + ',' + b + ')',frame);
frame++;
}
}
//使用方法
fadeColor(
{r:255,g:255,b:134}, //star color
{r:255,g:255,b:255}, //end color
function(color) {
document.getElementById("left").style.backgroundColor = color;
},
1
);
function fadeColor( from, to, callback, duration, totalFrames) {
//用一个函数来包裹setTimeout，根据帧数来确定延时
function doTimeout(color,frame) {
setTimeout(function() {
try {
callback(color);
} catch(e) {
JSLog.write(e);
}
}, (duration*1000/totalFrames)*frame);
//总持续秒数/每秒帧数*当前帧数=延时(秒)，再乘以1000作为延时(毫秒)
}
// 整个渐变过程的持续时间，默认为1秒
var duration = duration || 1;
// 总帧数，默认为持续秒数*15帧，也即每秒15帧
var totalFrames = totalFrames || duration*15;
var r,g,b;
var frame = 1;
//在第0帧设置起始颜色
doTimeout('rgb(' + from.r + ',' + from.g + ',' + from.b + ')',0);
//计算每次变化所需要改变的rgb值
while (frame < totalFrames+1) {
r = Math.ceil(from.r * ((totalFrames-frame)/totalFrames)
+ to.r * (frame/totalFrames));
g = Math.ceil(from.g * ((totalFrames-frame)/totalFrames)
+ to.g * (frame/totalFrames));
b = Math.ceil(from.b * ((totalFrames-frame)/totalFrames)
+ to.b * (frame/totalFrames));
// 调用本frame的doTimeout
doTimeout('rgb(' + r + ',' + g + ',' + b + ')',frame);
frame++;
}
}
//使用方法
fadeColor(
{r:255,g:255,b:134}, //star color
{r:255,g:255,b:255}, //end color
function(color) {
document.getElementById("left").style.backgroundColor = color;
},
1
);
