Rumah > hujung hadapan web > html tutorial > 漂浮窗口受后面样式影响变透明的问题_html/css_WEB-ITnose

漂浮窗口受后面样式影响变透明的问题_html/css_WEB-ITnose

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB
Lepaskan: 2016-06-21 09:19:21
asal
1036 orang telah melayarinya
鼠标放上去后弹出的漂浮选项菜单是透明的,怎样才能让它不透明?



原代码如下:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><title>下拉</title><style>#sddm{	margin: 0 auto;	padding: 0;	z-index: 30;	background-color:#F4F4F4;	width: 480px;	height:23px;}#sddm li{	margin: 0;	padding: 0;	list-style: none;	float: left;	font: bold 12px arial}#sddm li a{	display: block;	margin: 0 1px 0 0;	padding: 4px 10px;	width: 60px;	background: #5970B2;	color: #FFF;	text-align: center;	text-decoration: none}#sddm li a:hover{	background: #49A3FF}#sddm div{	position: absolute;	visibility: hidden;	margin: 0;	padding: 0;	background: #EAEBD8;	border: 1px solid #5970B2}#sddm div a	{	position: relative;		display: block;		margin: 0;		padding: 5px 10px;		width: auto;		white-space: nowrap;		text-align: left;		text-decoration: none;		background: #EAEBD8;		color: #2875DE;		font: 12px arial}	#sddm div a:hover	{	background: #49A3FF;		color: #FFF}		body{ font-size:12px; color:#666666; line-height:18px;}.clear{ clear:both;}.mtop5{ margin-top:5px;}.title{ border:solid 1px #d4d4d4; height:20px; font-weight:bold; position:relative; border-left:none; border-right:none;}.title-t{ position:absolute; top:0px; left:0px; border-bottom:solid 2px #4583bd; height:20px; line-height:20px; padding-left:10px;}</style><!-- dd menu --><script type="text/javascript">function prepareData(){	var a = document.getElementById("m3");	var b = document.createElement('a')	b.innerHTML = "This is a test";	b.href="http://www.baidu.com";	b.target="_blank";	b.onclick="test()";	a.appendChild(b);		var c = document.createElement('input');	c.type="button";	c.value="test";	//c.onclick="test()";	c.setAttribute("onclick", "test()");           	a.appendChild(c);}	function test(){	alert("1234");}<!--var timeout = 500;var closetimer= 0;var ddmenuitem = 0;// open hidden layerfunction mopen(id){		// cancel close timer	mcancelclosetime();	// close old layer	if(ddmenuitem) ddmenuitem.style.visibility = 'hidden';	// get new layer and show it	ddmenuitem = document.getElementById(id);	ddmenuitem.style.visibility = 'visible';}// close showed layerfunction mclose(){	if(ddmenuitem) ddmenuitem.style.visibility = 'hidden';}// go close timerfunction mclosetime(){	closetimer = window.setTimeout(mclose, timeout);}// cancel close timerfunction mcancelclosetime(){	if(closetimer)	{		window.clearTimeout(closetimer);		closetimer = null;	}}// close layer when click-outdocument.onclick = mclose; // --></script></head><body style="text-align:center" onload="prepareData();"><ul id="sddm"> 	<li><a href="#" onmouseover="mopen('m3')" onmouseout="mclosetime()">标题</a>		<div style=" position: relative; top: 0px;  left: 40px;" id="m3" onmouseover="mcancelclosetime()" onmouseout="mclosetime()">		<a href="#">Visa</a>		<a href="#">Paypal</a>		</div>	</li></ul><div class="mtop5">    <div class="title">    	<div class="title-t">情况</div>    </div></div></body></html>
Salin selepas log masuk


回复讨论(解决方案)

选项菜单设置背景颜色

选项菜单设置背景颜色



不管用啊,你怎么试的?


选项菜单设置背景颜色



不管用啊,你怎么试的?



不是背景透明,是title层,高于onmouseover层.

#sddm div {z-index:10}



选项菜单设置背景颜色



不管用啊,你怎么试的?



不是背景透明,是title层,高于onmouseover层.



那怎么办啊?我要的就是下面这样的效果,visia选项把横线覆盖。

#sddm div {z-index:10}



也不管用呢


#sddm div {z-index:10}



也不管用呢


<div style=" position: relative; top: 0px;  left: 40px; z-index:10;" id="m3" onmouseover="mcancelclosetime()" onmouseout="mclosetime()">
Salin selepas log masuk
Salin selepas log masuk

代码结构很乱哦.

<div style=" position: relative; top: 0px;  left: 40px; z-index:10;" id="m3" onmouseover="mcancelclosetime()" onmouseout="mclosetime()">
Salin selepas log masuk
Salin selepas log masuk

代码结构很乱哦.

大神啊。谢谢啦。
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan