Maison > interface Web > tutoriel HTML > 用superslide写的导航栏下拉错位_html/css_WEB-ITnose

用superslide写的导航栏下拉错位_html/css_WEB-ITnose

WBOY
Libérer: 2016-06-24 11:37:47
original
1336 Les gens l'ont consulté

如图


回复讨论(解决方案)

代码是:
html:


   


   

<script>jQuery("#box3").slide({ type:".menu", titCell:".nli", targetCell:".sub",effect:"slideDown",delayTime:300,triggerTime:0,returnDefault:false});</script>


css:
.clearfix:after{content:".";display:block;height:0;clear:both;visibility:hidden;}
.box3{width:1440px;
height:48px;
margin:0 auto;
background:url(images/navBg.jpg) center no-repeat;
position:relative;
z-index:1;}
.box3 ul{ width:1000px;
height:30px;
list-style:none;
margin:0;
padding-left:400px;
}
.box3 .nli{width:100px;
height:30px;
float:left;
font-size:20px;
text-align:center;
color:#FFFFFF;
padding-top:18px;
position:relative;
display:inline;}
.box3 .nli a{
display:block;
color:#FFFFFF;
text-decoration:none;}
.box3 .sub{display:none;
width:100px;
height:240px;
top:45px;
position:absolute;
margin:0;
padding:0;
list-style:none;
left:0;}

.box3 .sub li{zoom=1;
background-color:#00CCCC;
font-size:20px;
}

.box3 .sub a{
display:block;
text-decoration:none;
color:#FFFFFF;}
.box3 .sub a:hover{ background:#666666;color:#6600FF;}
.box3 .on a{ background-color:#666666;}

“关于舒适保”的二级菜单是四个啊?哪错位了?

“关于舒适保”的二级菜单是四个啊?哪错位了?


我的鼠标位置是在首页上 而出现的下拉菜单在关于宝舒适上 

估计<script>jQuery("#box3").slide({ type:".menu", titCell:".nli", targetCell:".sub",effect:"slideDown",delayTime:300,triggerTime:0,returnDefault:false});</script>
这句有问题,话说你要是放在导航栏的其他位置正常么?我猜是不是你放在任何位置都会显示“关于舒适保”的二级菜单。

估计<script>jQuery("#box3").slide({ type:".menu", titCell:".nli", targetCell:".sub",effect:"slideDown",delayTime:300,triggerTime:0,returnDefault:false});</script>
这句有问题,话说你要是放在导航栏的其他位置正常么?我猜是不是你放在任何位置都会显示“关于舒适保”的二级菜单。


不是 所有的都往后移了一个位置 最后一个与倒数第二个有重合


估计<script>jQuery("#box3").slide({ type:".menu", titCell:".nli", targetCell:".sub",effect:"slideDown",delayTime:300,triggerTime:0,returnDefault:false});</script>
这句有问题,话说你要是放在导航栏的其他位置正常么?我猜是不是你放在任何位置都会显示“关于舒适保”的二级菜单。


不是 所有的都往后移了一个位置 最后一个与倒数第二个有重合

我可能比较菜,所以<script>jQuery("#box3").slide({ type:".menu", titCell:".nli", targetCell:".sub",effect:"slideDown",delayTime:300,triggerTime:0,returnDefault:false});</script>这句我看不懂,我猜是这句就是显示下拉菜单的,但逻辑上我没理清楚。

你去看看这个帖子:http://bbs.csdn.net/topics/391818704。   他写的这个demo逻辑就清楚多了,但可能没有二级菜单滑动显示的效果,会突然显示出来。



估计<script>jQuery("#box3").slide({ type:".menu", titCell:".nli", targetCell:".sub",effect:"slideDown",delayTime:300,triggerTime:0,returnDefault:false});</script>
这句有问题,话说你要是放在导航栏的其他位置正常么?我猜是不是你放在任何位置都会显示“关于舒适保”的二级菜单。


不是 所有的都往后移了一个位置 最后一个与倒数第二个有重合

我可能比较菜,所以<script>jQuery("#box3").slide({ type:".menu", titCell:".nli", targetCell:".sub",effect:"slideDown",delayTime:300,triggerTime:0,returnDefault:false});</script>这句我看不懂,我猜是这句就是显示下拉菜单的,但逻辑上我没理清楚。

你去看看这个帖子:http://bbs.csdn.net/topics/391818704。   他写的这个demo逻辑就清楚多了,但可能没有二级菜单滑动显示的效果,会突然显示出来。
好的!谢谢!PS:如果不知道的话,你说看不懂的这个调用是大话主席写的superslide,是一个效果库,只不过因为不知道里面的实现,用起来的就显得比较难,并不是你菜。

怎么结贴啊。。。

怎么结贴啊。。。

头像可爱,人也可爱!
Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal