文档章节

html底部跟屏导航栏

tianhuahua
 tianhuahua
发布于 2014/06/11 18:21
字数 871
阅读 129
收藏 0
<html>
<head>
<style type="text/css">
.home_bottom {position:fixed; height:44px; background:#494c4a; bottom:0; width:100%; background:url(./image/bgimg3.gif) 0 -1506px repeat-x; _position:absolute; _bottom:auto; _top:expression(eval(document.documentElement.scrollTop+document.documentElement.clientHeight-this.offsetHeight-(parseInt(0,10)||0)-(parseInt(this.currentStyle.marginBottom,10)||0)));}
.home_bottom_ly {width:990px; margin:auto;  background:url(./image/bf_bg2.png) no-repeat; height:43px;}
.home_bottom_ly2 {width:990px; margin:auto;  background:url(./image/bf_bg2.png) 0 -94px no-repeat; height:43px;}
.hb_link01,.hb_link02,.hb_link03,.hb_link04,.hb_link05,.hb_link07,.hb_link08,.hb_link09,.hb_link10,.hb_link11{display:block; float:left; height:30px; margin-top:12px;}
.hb_link01 {width:40px;}
.hb_link01:hover { background:url(./image/bf_bg2.png) 0 -60px no-repeat;}
.hb_link02 {width:90px; margin-left:67px;}
.hb_link02:hover { background:url(./image/bf_bg2.png) -977px -60px no-repeat;}
.hb_link03 {width:90px; margin-left:33px;}
.hb_link03:hover { background:url(./image/bf_bg2.png) -230px -60px no-repeat;}
.hb_link04 {width:90px; margin-left:28px;}
.hb_link04:hover { background:url(./image/bf_bg2.png) -349px -60px no-repeat;}
.hb_link05 {width:90px; margin-left:24px;}
.hb_link05:hover { background:url(./image/bf_bg2.png) -462px -60px no-repeat;}
.hb_link06 {width:130px; margin-left:25px; display:block; float:right; height:43px;}
.hb_link06:hover { background:url(./image/bf_bg2.png) -860px -48px no-repeat;}
.hb_link07 {width:40px; margin-left:70px; _margin-left:70px;}
/*.hb_link07:hover {background:url(../images/bf_bg2.png) -40px -151px no-repeat;}*/
.hb_link08 {width:98px; margin-left:7px;}
.hb_link08:hover { background:url(./image/bf_bg2.png) -118px -151px no-repeat;}
.hb_link09 {width:96px; margin-left:22px;}
.hb_link09:hover { background:url(./image/bf_bg2.png) -231px -151px no-repeat;}
.hb_link10 {width:92px; margin-left:26px;}
.hb_link10:hover { background:url(./image/bf_bg2.png) -358px -151px no-repeat;}
.hb_link11 {width:104px; margin-left:19px;}
.hb_link11:hover { background:url(./image/bf_bg2.png) -470px -151px no-repeat;}
.home_bottom_qh {float:left; margin:13px 29px auto auto;}
.home_bottom_img {margin-top:13px; float:left;}
.home_bottom_img img {margin-right:24px;}
.ancqh {position:absolute; float:left; margin:-20px 0 0 10px; *margin:-20px 0 0 -965px; filter:alpha(opacity=80); -moz-opacity:0.8; opacity: 0.8;}
</style>

</head>
<body>
<div style="width:100%;float:left;height:1100px;">

</div>
<!-- 浮动 --><!-- 底部客服 -->
<div class="home_bottom">

    <div class="home_bottom_ly2" id="float_bottom_02">
        <div class="hb_link07"></div>
        <a href="http://open.fxmillion.com/" target="_blank" class="hb_link08"></a>       
        <a href="http://member.fxmillion.com/" target="_blank" class="hb_link09"></a>
        <a href="http://fxmillion.com/Download/mti4setup.exe" target="_blank" class="hb_link10"></a>
        <a href="http://member.fxmillion.com/" target="_blank" class="hb_link11"></a>	
		<a href="http://wpa.qq.com/msgrd?v=3&uin=4008440118&Site=www.fxmillion.com&Menu=yes" target="_blank" class="hb_link06"></a>   
    </div>    
</div>
<!--页底 End--><!-- 底部客服 -->
 
</body>
</html>

<script>
(function(){function e(e,n,r,i){var r=r||500,s=i||function(){},o,u=parseInt(t(e,"height"),10);e.toggled?o=e.originalHeight:(o=u,e.originalHeight=o);var a=Math.round(r/o);n=="show"&&(e.style.height="0"),e.style.display="block",e.toggled=!0;var f=o;for(var l=f;l>=0;l--)(function(t){var r=n=="show"?t*a:(f-t)*a;setTimeout(function(){(t==0&&n=="hide"||t==f&&n=="show")&&s(),e.style.height=t+"px";var r=t/f;e.style.opacity=r,e.style.filter="alpha(opacity="+r*100+")"},r)})(l)}function t(e,t){if(e.style[t])return e.style[t];if(e.currentStyle)return e.currentStyle[t];if(document.defaultView&&document.defaultView.getComputedStyle){t=t.replace(/([A-Z])/g,"-$1"),t=t.toLowerCase();var n=document.defaultView.getComputedStyle(e,"");return n&&n.getPropertyValue(t)}return null}function n(e,t,n){var r=function(e,t){try{return e.contains?e!=t&&e.contains(t):!!(e.compareDocumentPosition(t)&16)}catch(n){}},i=function(e){var t=e.currentTarget,i=e.relatedTarget;!r(t,i)&&t!=i&&n.call(e.currentTarget,e)};e.addEventListener?t=="mouseenter"?e.addEventListener("mouseover",i,!1):t=="mouseleave"?e.addEventListener("mouseout",i,!1):e.addEventListener(t,n,!1):e.attachEvent("on"+t,n)}function r(t){var r=this;r.cfg=t;var i=function(){n(r.cfg.closeBtn,"click",function(){r.close()}),n(r.cfg.wrap,"mouseenter",function(){r._timingClose("stop")}),n(r.cfg.wrap,"mouseleave",function(){r._timingClose("start",3)}),n(window,"focus",function(){r._pollStop=!1}),n(window,"blur",function(){r._pollStop=!0}),window[r.cfg.pollCallback]=r._push,window[r.cfg.contentCallback]=r._fillContent,r.start()},s=function(e,t){var n="popush_scriptloader";document.getElementById(n)!==null&&document.body.removeChild(document.getElementById(n));var i=document.createElement("script");i.id=n,i.type="text/javascript",i.async=!0,i.src=r.cfg.preventCache?e+"?"+Math.round(Math.random()*1e10):e,i.onload=t||function(){return!1},document.body.appendChild(i)},o=function(){var e=location.host.split(".").reverse()[2],t="?id="+r.cfg.id+"&cname="+e+"&rnd="+Math.round(Math.random()*1e10);(new Image).src=(r.cfg.countUrl||"count.php")+t};r._getDisplayState=function(){return!r._state||r._state=="hide"?"hide":"show"},r._display=function(t){if(r._getDisplayState()==t)return!1;e(r.cfg.contentWrap,t),r._state=t},r._timingClose=function(e,t){if(r._getDisplayState()=="hide")return!1;var t=t||r.cfg.hideAfter;e=="start"?r._closeTimer=setTimeout(function(){r._display("hide")},t*1e3):e=="stop"&&typeof r._closeTimer!="undefined"&&clearTimeout(r._closeTimer)},r.close=function(){if(!-[1,]&&!window.XMLHttpRequest){r.cfg.wrap.style.display="none";return !1;}r._getDisplayState()=="show"?r._display("hide"):r.cfg.wrap.style.display="none"},r._fillContent=function(e){r.contentCache=e,r.cfg.contentWrap.innerHTML=e,r._display("show"),r._timingClose("start")},r.manualShow=function(){if(r._getDisplayState()=="show")return!1;r.contentCache?r._fillContent(r.contentCache):s(r.cfg.contentUrl)},r._push=function(e){var t=Math.round((new Date).valueOf()/1e3),n=parseInt(e,10),i=t-n,u=NTES.cookie.get("PopPushData");if(u==n)return!1;if(r.cfg.oldTime&&i>r.cfg.oldTime)return!1;s(r.cfg.contentUrl),NTES.cookie.set("PopPushData",e,"30m",".163.com","/"),o()},r._poll=function(){r._pollStop||s(r.cfg.pollUrl)},r.start=function(){r._pollStop=!1,r._poll(),window.setInterval(r._poll,r.cfg.pollCycle*1e3)},i()}window.PopPush=r})()
</script>


© 著作权归作者所有

共有 人打赏支持
上一篇: 侧边栏跟屏
tianhuahua
粉丝 3
博文 48
码字总数 14194
作品 0
深圳
程序员
私信 提问
(转载)iPhoneX适配之UI设计、交互设计

原文地址:http://blog.csdn.net/u011363981/article/details/78011757#reply 前言 苹果近日发布了全新的iPhone X全面屏手机,这也是首款采用OLED屏幕的iPhone手机,它的正面设计被更多人吐槽...

小曼study
2017/10/23
0
0
UINavigationBar 使用总结

UINavigationBar是我们在开发过程中经常要用到的一个控件,下面我会为大家介绍一些常用的用法。 1. 设置导航栏的标题 这个不多说,直接上代码 2. 设置导航栏的背景颜色 得到的效果如下: Sn...

刀客445
2016/08/03
27
0
MDUI 0.2.0 发布,Material Design 前端框架

MDUI 0.2.0 发布了, MDUI 是一个 Material Design 前端框架,无依赖、响应式、支持多种主题切换。此次更新内容包括: 开放了内置的 DOM 操作库,它拥有和 jQuery 类似的语法,包含了 CSS 选...

zdhxiong
2017/04/28
1K
4
Android P 导航栏变为两颗虚拟键,或支持原生手势操作

从目前的趋势来看,手机继续弱化按键将成为主流,技术支撑包括全面屏、屏下指纹,以后今后的屏下摄像头、传感器甚至是听筒等。 没有了按键,交互完全依赖屏幕,所以在iPhone X的iOS 11系统上...

局长
04/15
0
0
Flex 布局教程(实例)

你会看到,不管是什么布局,Flex往往都可以几行命令搞定。 详细的语法解释请查阅《Flex布局教程(语法篇)》。主要参考资料是Landon Schropp的文章和Solved by Flexbox。 一、骰子的布局 骰子的...

botkenni
2016/10/09
49
0

没有更多内容

加载失败,请刷新页面

加载更多

Nginx 内置请求参数

nginx内置变量 内置变量存放在 ngx_http_core_module 模块中,变量的命名方式和apache 服务器变量是一致的。总而言之,这些变量代表着客户端请求头的内容,例如$http_user_agent, $http_coo...

大木老师故事的小黄花
昨天
2
0
我为什么坚持写作

说写作可能是抬高了自己,目前来说只能是写东西、记录东西、表达观点和情感。 在俞敏洪的公众号上看到过一篇文章,里面讲了一个观点,大概是说写作不求能写出伟大的作品,只是把自己的生活、...

Bob2100
昨天
3
0
中国公有云三巨头,同时支持Rancher Kubernetes平台

华为云容器引擎(CCE)、阿里云K8S容器服务(ACK)和腾讯云K8S引擎(TKE),中国公有云三巨头正式全面支持Rancher Kubernetes平台。 Rancher正式宣布扩大对中国领先Kubernetes服务的支持,华...

RancherLabs
昨天
1
0
【NLP】【八】基于keras与imdb影评数据集做情感分类

【一】本文内容综述 1. keras使用流程分析(模型搭建、模型保存、模型加载、模型使用、训练过程可视化、模型可视化等) 2. 利用keras做文本数据预处理 【二】环境准备 1. 数据集下载:http:...

muqiusangyang
昨天
3
0
nginx 解决session一致性

session 粘滞性 每个请求按访问ip的hash结果分配,这样每个访客固定访问一个后端服务器,可以解决session的问题。 upstream backserver {ip_hash;server 192.168.0.14:88;server 192.1...

zhu_kai1
昨天
2
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部