数据载入中,请稍后......
 
展开
懒人码库客户端 点击或扫描下载
欢迎来到懒人码库!懒人码库QQ群:19651313
欢迎来到懒人码库!懒人码库QQ群:19651313  

手机触屏网页的底部固定悬浮导航

2014-11-02 13:14 来源:懒人码库 / 作者:懒人码库 已被阅读:次 分类:悬浮漂浮 上一篇:没有了 下一篇:超好用的弹出层、对话框、弹出窗口事件类JS代码(附教程)
<!DOCTYPE html>  
<html>  
<HEAD>  
<TITLE>手机触屏网页的底部固定悬浮导航</TITLE>  
<META content="text/html; charset=utf-8" http-equiv=Content-Type>  
<META name=apple-mobile-web-app-capable content=yes>  
<META name=viewport 
content="width=device-width, minimum-scale=1.0, maximum-scale=1.0,user-scalable=no">  
<META name=GENERATOR content="MSHTML 8.00.6001.19394">  
<META name=keywords content=aasdasd,小商品,小商品小商品,小商品>  
<META name=template content=swy_11><LINK rel=Stylesheet type=text/css   
href="images/base.css"></LINK>  
<STYLE>HTML {  
    OVERFLOW-X: hidden  
}  
</STYLE>  
</HEAD>  
<BODY><!-- 头 --><HEADER>  
<H2 class=touchversion>aasdasd</H2></HEADER><SECTION class=search><!-- 搜索框 -->
<FORM method=post action=#><NAV class=menu>  
<UL>  
  <LI style="WIDTH: 33%; FLOAT: left"><A 
  href="http://192.168.1.110:9001/wap.php?homepage=zhang">网站首页</A></LI>  
  <LI style="WIDTH: 33%; FLOAT: left"><A 
  href="http://192.168.1.110:9001/wap.php?homepage=zhang&amp;file=introduce">公司介绍</A></LI>  
  <LI style="WIDTH: 33%; FLOAT: left"><A 
  href="http://192.168.1.110:9001/wap.php?homepage=zhang&amp;file=sell">供应产品</A></LI>  
  <LI style="WIDTH: 33%; FLOAT: left"><A 
  href="http://192.168.1.110:9001/wap.php?homepage=zhang&amp;file=news">新闻中心</A></LI>  
  <LI style="WIDTH: 33%; FLOAT: left"><A 
  href="http://192.168.1.110:9001/wap.php?homepage=zhang&amp;file=honor">荣誉资质</A></LI>  
  <LI style="WIDTH: 33%; FLOAT: left"><A 
  href="http://192.168.1.110:9001/wap.php?homepage=zhang&amp;file=contact">联系方式</A></LI></UL></NAV></FORM></SECTION>  
<DIV class=clear></DIV><!---页面加载特效开始--->
<DIV style="HEIGHT: 40px"></DIV>  
<DIV style="POSITION: relative; HEIGHT: 42px" id=introFocus 
class="cb t1-bg9 mgBT14">  
<DIV class="intro pdL15 forLeft ">  
<DIV class="fl lh100 fs15 fcw curre">公司介绍</DIV></DIV>  
<DIV class="intro mgBT14 wid100"></DIV></DIV>  
<DIV style="OVERFLOW: hidden" id=intro class="introImg mgBT14 tac cb"><IMG 
src="images/company.jpg" height=90></DIV>  
<DIV class="introTxt mgBT20 pdL10">  
<DIV><FONT>&nbsp;爱上大声大声道<BR>大声大声道<BR>大声道</FONT></DIV></DIV>  
<DIV style="POSITION: relative; HEIGHT: 42px" id=serviceFocus 
class="cb t1-bg9 mgBT14">  
<DIV class="intro pdL15 forLeft ">  
<DIV class="fl lh100 fs15 fcw curre">最新供应</DIV></DIV>  
<DIV class="intro mgBT14 wid100">  
<DIV class="fr fs14 tac more"></DIV></DIV></DIV>  
<DIV id=album class="pdL1 mgBT6 cb">  
<DIV class="album mgL4 mgBT14 fl tac">  
<DIV class=block><A 
href="http://192.168.1.110:9001/wap.php?homepage=zhang&amp;file=sell&amp;itemid=119517"><IMG 
src="images/09-18-18-21-14858.png.thumb.png"></A></DIV>  
<DIV class="plain tac"><A 
href="http://192.168.1.110:9001/wap.php?homepage=zhang&amp;file=sell&amp;itemid=119517">供应test</A></DIV></DIV></DIV>  
<DIV style="CLEAR: both"></DIV>  
<DIV style="HEIGHT: 49px" class=cb></DIV>  
<DIV class=bottom-fixed>  
<DIV id=comp_tel class=tel><A href="tel:15952763239"><SPAN 
id=comp_tel_span>电话咨询</SPAN></A></DIV>  
<DIV id=comp_sms class=sms><A href="sms:15952763239"><SPAN id=comp_sms_span>短信咨询   
</SPAN></A></DIV>  
<DIV id=comp_chat class=chat><A 
href="http://192.168.1.110:9001/wap.php?homepage=zhang&amp;file=contact&amp;a=gestbook"><SPAN 
id=comp_chat_span>在线沟通</SPAN></A> </DIV></DIV>  
<DIV></DIV><IMG style="DISPLAY: none" src="images/img.gif"></IMG>  
<SCRIPT type=text/javascript>function addListener(element,e,fn){if(element.addEventListener){element.addEventListener(e,fn,false);}else{element.attachEvent("on"+e,fn);}}function getHref(str){var pos = str.indexOf("'");var next = str.indexOf("'",pos+2);return str.substring(pos+1,next);}window.onload=function(){var bindLogEvent=function(divid,type){var elem=document.getElementById(divid);if(elem){var temp =elem.onclick.toString();elem.onclick="return false";addListener(elem,"click",function(){var url="http://mobi.baidu.com/mobcardbgstat/img.gif?uid=5794307&cid=4923&type="+type + "&ts=" + (+new Date());baidu.ajax.get(url,function(xhr,msg){});location.href=getHref(temp);});}};bindLogEvent("comp_tel","phone");bindLogEvent("comp_sms","sms");bindLogEvent("comp_chat","online");}</SCRIPT>  
 </BODY></HTML>

 演示 | 下载

小贴士:懒人码库 为网页前端人员提供建站常用的广告代码和网页特效,内容涵盖焦点图,导航菜单,jQuery代码,图片特效,对联广告,日历控件,在线客服等。