注册 | 登陆

您的位置：阿里西西 > 网页特效 > 页面特效 > 详细内容

13顶

解决下拉列表图层被视频层遮挡并浮动在上面的特效案例

稿源：互联网 2018-09-03 02:30:13 点击： 12348 撤稿纠错

一段解决网站视频的层遮挡导航下拉菜单的特效代码

以下讨论的是和下拉浮动视频相关的解决下拉列表图层被视频层遮挡并浮动在上面的特效案例教程文章，内容是本站精心挑选整理的教程，希望对广大的网友给到帮助,下面是详细内容：

脚本代码(For Alixixi.com)如下:

<style>
body{ font:13px/1.5 Arial,5b8b4f53,Tahoma,sans-serif;background:#fff; color:#333;}
html,body,p,dl,dt,dd,table,td,th,input,img,form,div,span,ul,ol,li,h1,h2,h3,h4,h5,h6,select,fieldset,fieldset,input,button,sub,sup,textarea{margin:0;padding:0; }
table {border-collapse:collapse; border-spacing:0;}
h1,h2,h3,h4,h5,h6 {font-size:100%;} 
iframe,img{ border:0 none;}
img{ vertical-align:middle;}
em,i{font-style: normal;}
ul,li,ol{list-style:none outside none;}
.clearfix:after{content:".";display:block;height:0;clear:both;visibility:hidden;}
.clearfix{*zoom:1;}
a{ text-decoration:none;color:#333}
a:hover{ text-decoration:underline;color:#f30}
.aMore { font-family:5b8b4f53}
:focus { outline:0;}
.clear{ clear:both; overflow:hidden; font-size:0; height:0;line-height:0;}
.right { float:right}
.left { float:left}

.nav { height:40px; line-height:40px; position:relative; z-index:20}
.navCon { width:300px; text-align:center; font-size:14px;}
.navCon .sTit { display:block; height:40px; overflow:hidden}
.navCon ul { display:none; position:absolute; top:40px; left:0; background:#fff; width:300px;}
.navCon ul li { line-height:20px; height:20px; overflow:hidden; width:100%; float:left}
.navCon:hover ul { display:block}

.videoCon { position:relative; z-index:10; padding:20px 0 0 0;}

</style>

<div class="nav">
 <div class="navCon">
     <span class="sTit">鼠标放这里查看效果</span>
        <ul class="clearfix">
         <li>图层浮动在视频层的上面</li>
            <li>12313123</li>
            <li>12313123</li>
            <li>12313123</li>
            <li>12313123</li>
            <li>12313123</li>
        </ul>
    </div>
</div>

<div class="videoCon"><embed src="http://www.tudou.com/a/Xf-u5hWu2qg/&bid=05&iid=131714371&resourceId=0_05_05_99/v.swf" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" wmode="opaque" width="480" height="400"></embed></div>

关于解决下拉列表图层被视频层遮挡并浮动在上面的特效案例的内容写到这里就结束啦，您可以收藏本页网址https://js.alixixi.com/a/2018090393312.shtml方便下次再访问哦。

·上一篇： 一款快递物流运费计算功能的特效代码，可自动统计首重续重费用和重量
·下一篇： 用js检测判断时间日期的间距大于多少天

相关阅读

文章分类LIST >>返回首页

排行总榜

避免你的邮箱地址被自动收集的代码
有趣的按钮
控制用按钮打开新窗口的属性
单击按钮或图片打开IE首页
点击按钮打印该页
仿软件浮动按钮
在规定时间内方有效的按钮
一个按钮完成对文本框内容的复制
按钮选中文本框内所有内容
Windows式样的按钮

最新游戏

更多 »

最新新闻

更多 »