整理前端css/js/jq常见问题及解决方法(3)

jq:

1、prepend(参数);//将参数内容前置再某元素内部;

eg:

<div id="div1">奇妙能力歌</div>

$("#div1").prepend("<a href='#'>陈粒</a>");

//得出结果:<div id="div1"><a href='#'>陈粒</a>奇妙能力歌</div>

2、

outerHeight(boolean)

outerHeight(false);//不计算元素的margin值 计算padding和border

outerHeight(true);//计算元素的margin值

3、delay(time);延迟;

eg:$("#div1").delay(300).show();//该元素延迟300ms再执行显示;

4、设置滚动条动态滑动

$(document).scrollTop();//滚动条高度

$("body").animate({scrollTop : 500px},500);

5、打开新窗口

window.open("url");

6、同个类名绑定多个事件,用连写方法

eg:

$("#focus").keydown(function(){

//xx

}).focus(function(){

//xxx

});

7、雪碧背景图

.icon icon-1
<span class="icon icon-1"></span>
.icon{background:url('') no-repeate;}
.icon-1{background-position:-24px -100px;}
背景图显示不出,
解决:
.icon{background-image:url('');background-repeate:no-repeate;}
.icon-1{background-position:-24px -100px;}

8、界面中

若<div><a><img /></a><a><img /></a></div>
a标签里面有img标签,img高度为88,但实际上div的高度为92,“幽林空白节点”
解决方法:给img标签添加vertical-align:middle;或者img{display:block;}a{font-size:0;}

兼容性:

ie7:要让overflow:hidden;有效,需要再其父元素加 position:relative;

原文地址:https://www.cnblogs.com/ss977/p/6763757.html