文档章节

html底部跟屏导航栏

tianhuahua
 tianhuahua
发布于 2014/06/11 18:21
字数 871
阅读 111
收藏 0
点赞 0
评论 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
博文 19
码字总数 8749
作品 0
深圳
程序员
UINavigationBar 使用总结

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

刀客445 ⋅ 2016/08/03 ⋅ 0

移动端导航的七种设计模式

原文出处:elaine90 根据产品层级的深度和广度,选择适合的导航模式,是产品设计中的关键一环。与大家共勉。 写在前面:看了很多总结导航的文章,其实都基本雷同,但是都觉得不够细致,也不是...

elaine90 ⋅ 2015/11/17 ⋅ 0

MDUI 0.2.0 发布,Material Design 前端框架

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

zdhxiong ⋅ 2017/04/28 ⋅ 4

Android P 导航栏变为两颗虚拟键,或支持原生手势操作

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

局长 ⋅ 04/15 ⋅ 0

超实用!网站导航栏设计形式总结

导航对于一个网站来说,起到重要的引导作用。一个优秀的导航设计可以让用户快速的找到所需 ,让用户清晰明了的了解到网站的结构框架,起到重要的指引作用。下面跟大家分享下常用的几种网页导...

郑乔尹在旅游 ⋅ 2017/12/28 ⋅ 0

Bootstrap 响应式项目分享一

网页链接地址:http://chem960.vicp.cc:9128 该页面中主要用到的有 1. 全局 CSS 样式 -- 栅格系统 2. 全局 CSS 样式 -- 按钮 3. 全局 CSS 样式 -- 辅助类 4. 组件 -- 按钮式下拉菜单 5. 组件...

Neuro_annie ⋅ 2017/12/27 ⋅ 0

iPhone App的特点及基本设计方法

iPhone App的特点 iPhone有自己的特点和气质,因此他的App不同于其他键盘手机甚至Android这种触屏手机。 首先iPhone只有一个物理按键Home,而这个按钮主要是在系统级操作上起到一些作用,在一...

junwong ⋅ 2012/02/29 ⋅ 0

Bootstrap 导航栏

导航栏是一个很好的功能,是 Bootstrap 网站的一个突出特点。导航栏是响应式元组件就,作为应用程序或网站的导航标题。导航栏在移动设备的视图中是折叠的,随着可用视口宽度的增加,导航栏也...

wybo521 ⋅ 2016/01/27 ⋅ 0

Android项目-几种常见的应用架构

android两种Tab分页的方式:TabActivity和ActivityGroup http://www.apkbus.com/blog-70574-40942.html 1、单个Activity架构(推荐) 首页是Activity,里面页面为View 头部底部栏都是公用的,...

刘遇安 ⋅ 2014/08/28 ⋅ 0

Flex 布局教程(实例)

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

botkenni ⋅ 2016/10/09 ⋅ 0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

高并发之Nginx的限流

首先Nginx的版本号有要求,最低为1.11.5 如果低于这个版本,在Nginx的配置中 upstream web_app { server 到达Ip1:端口 max_conns=10; server 到达Ip2:端口 max_conns=10; } server { listen ...

算法之名 ⋅ 今天 ⋅ 0

Spring | IOC AOP 注解 简单使用

写在前面的话 很久没更新笔记了,有人会抱怨:小冯啊,你是不是在偷懒啊,没有学习了。老哥,真的冤枉:我觉得我自己很菜,还在努力学习呢,正在学习Vue.js做管理系统呢。即便这样,我还是不...

Wenyi_Feng ⋅ 今天 ⋅ 0

博客迁移到 https://www.jianshu.com/u/aa501451a235

博客迁移到 https://www.jianshu.com/u/aa501451a235 本博客不再更新

为为02 ⋅ 今天 ⋅ 0

win10怎么彻底关闭自动更新

win10自带的更新每天都很多,每一次下载都要占用大量网络,而且安装要等得时间也蛮久的。 工具/原料 Win10 方法/步骤 单击左下角开始菜单点击设置图标进入设置界面 在设置窗口中输入“服务”...

阿K1225 ⋅ 今天 ⋅ 0

Elasticsearch 6.3.0 SQL功能使用案例分享

The best elasticsearch highlevel java rest api-----bboss Elasticsearch 6.3.0 官方新推出的SQL检索插件非常不错,本文一个实际案例来介绍其使用方法。 1.代码中的sql检索 @Testpu...

bboss ⋅ 今天 ⋅ 0

informix数据库在linux中的安装以及用java/c/c++访问

一、安装前准备 安装JDK(略) 到IBM官网上下载informix软件:iif.12.10.FC9DE.linux-x86_64.tar放在某个大家都可以访问的目录比如:/mypkg,并解压到该目录下。 我也放到了百度云和天翼云上...

wangxuwei ⋅ 今天 ⋅ 0

PHP语言系统ZBLOG或许无法重现月光博客的闪耀历史[图]

最近在写博客,希望通过自己努力打造一个优秀的教育类主题博客,名动江湖,但是问题来了,现在写博客还有前途吗?面对强大的自媒体站点围剿,还有信心和可能型吗? 至于程序部分,我选择了P...

原创小博客 ⋅ 今天 ⋅ 0

IntelliJ IDEA 2018.1新特性

工欲善其事必先利其器,如果有一款IDE可以让你更高效地专注于开发以及源码阅读,为什么不试一试? 本文转载自:netty技术内幕 3月27日,jetbrains正式发布期待已久的IntelliJ IDEA 2018.1,再...

Romane ⋅ 今天 ⋅ 0

浅谈设计模式之工厂模式

工厂模式(Factory Pattern)是 Java 中最常用的设计模式之一。这种类型的设计模式属于创建型模式,它提供了一种创建对象的最佳方式。 在工厂模式中,我们在创建对象时不会对客户端暴露创建逻...

佛系程序猿灬 ⋅ 今天 ⋅ 0

Dockerfile基础命令总结

FROM 指定使用的基础base image FROM scratch # 制作base image ,不使用任何基础imageFROM centos # 使用base imageFROM ubuntu:14.04 尽量使用官方的base image,为了安全 LABEL 描述作...

ExtreU ⋅ 昨天 ⋅ 0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

返回顶部
顶部