底部悬浮通栏可以关闭广告位的实现方法

.footfixed{　　width:100%; 　　height:140px;   /* 图片大小，宽度必须100% */　　position:fixed;　　bottom:0;     /*固定定位，固定在浏览器底部。*/　　background: #081628;　　opacity: .7;  /*Chrome、Safari、Firefox、Opera */ 　　　filter:alpha(opacity=70);/* 针对 IE8 以及更早的版本 */}

.fimg {   height: 218px;    /*注意此处图片高度高于140px*/   width: 1190px;    margin: 0px auto;  /*整体内容部分居中*/ }

.fimg {   position: relative;  /*父元素相对定位*/   top:-78px; }

<div class="ftbj"></div> 

.ftbj{  position: absolute;  background:#081628;  height:100%;  width:100%;  top: 0;  left: 0;  opacity: .7;/*Chrome、Safari、Firefox、Opera */   filter: alpha(opacity=70);}/* 针对 IE8 以及更早的版本 */.footfixed{  width:100%;   height:140px;   /* 图片大小，宽度必须100% */  position:fixed;  bottom:0;     /*固定定位，固定在浏览器底部。*/  background: #081628;  opacity: .7;    /*Chrome、Safari、Firefox、Opera */     　　　　filter:alpha(opacity=70);/* 针对 IE8 以及更早的版本 */}

.fimg {  position: relative;  /*父元素相对定位*/}.close {  width: 33px;  height: 33px;     /* 图片大小 */  background: url(images/close.png) no-repeat center center;  /*图片引入路径 */  position: absolute;  right: 15px;  top: 85px;       /*通过定位实现固定固定在整个底部悬浮广告图片右上角 */}

.close {  transition: .5s;  cursor: pointer; /*通过定位实现固定固定在整个底部悬浮广告图片右上角 */}.close:hover {  transform: rotate(180deg);  -ms-transform: rotate(180deg);     /* IE 9 */  -moz-transform: rotate(180deg);    /* Firefox */  -webkit-transform: rotate(180deg);  /* Safari 和 Chrome */  -o-transform: rotate(180deg);    /* Opera */} /*旋转 图片*/

#fimg-min{  width: 80px;  height: 140px;           /* 图片大小 */  position: fixed;   bottom: 0px;   left: 0px;             /*定位*/    display: none;          /*隐藏*/  cursor: pointer;        /*小手 */}

<script>$(document).ready(function(){  $(".close").click(function () {    $('.footfixed').animate(      {height: '10px', opacity: '0.4'}, "slow", function () {    $('.footfixed').hide();    $('#fimg-min').show();    });  });    $('#fimg-min').click(function(){      $('.footfixed').show().css({height:'140px',opacity:'1'});      $('#fimg-min').hide();  });  });</script>