1.html部分
<!DOCTYPE html>
<html>
<head>
<title>blog_floatdiv.html</title>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<>
<link rel="stylesheet" type="text/css" href="./css/blog_floatdiv.css">
<script type="text/javascript" src="./js/jquery-1.9.1.js"></script>
<script type="text/javascript" src="./js/blog_floatdiv.js"></script>
</head>
<body>
<div id="fdiv">
我是浮动的div<img src="images/logingb.png">
</div>
浮动的div
浮动的div浮动的div浮动的div浮动的div浮动的div浮动的div浮动的div浮动的div
浮动的div
浮动的div
浮动的div
浮动的div
浮动的div
浮动的div
浮动的div
浮动的div
浮动的div
浮动的div
浮动的div
浮动的div
浮动的div
浮动的div
浮动的div
浮动的div
浮动的div
浮动的div
浮动的div
浮动的div
浮动的div
浮动的div 浮动的div浮动的div浮动的div浮动的div浮动的div浮动的div浮动的div浮动的div
浮动的div
浮动的div
浮动的div
浮动的div
浮动的div
浮动的div
浮动的div
浮动的div
浮动的div
浮动的div
浮动的div
浮动的div
浮动的div
浮动的div
浮动的div
浮动的div
浮动的div
浮动的div
浮动的div
浮动的div
浮动的div
浮动的div
浮动的div
浮动的div
浮动的div
浮动的div
浮动的div
浮动的div
浮动的div
浮动的div
浮动的div
浮动的div
浮动的div
浮动的div
</body>
</html>
2.css部分
#fdiv{
width:200px;
height: 500px;
background: yellow;
position: fixed;
top: 128px;
_position: absolute;
_top: expression(eval(document.documentElement.scrollTop) );
}
#fdiv img{
margin-left: 190px;
margin-top: 470px;
}
3.js部分
$(function() {
$("#fdiv img").click(function(){
$("#fdiv").hide();
});
});
【Html+CSS浮动的广告条实现分解】相关文章：
★ 借助HTML分别禁用IE8, IE9的兼容视图模式的小技巧
★ html中的div、td 、p 等容器内强制换行和不换行的实现