Text_Closed.style.display='inline'
Image_Open.style.display='inline'
Text_Open.style.display='inline'"
src="pic/m_o.gif"><IMG id="Image_Open<%= i %>" onclick="this.style.display='none'
Image_Closed.style.display='inline'
Text_Open.style.display='none'
Text_Closed.style.display='inline'"
src="pic/m_c.gif"></SPAN>
<SPAN id="Text_Closed">大目录
<SPAN id="Text_Open" style="DISPLAY: none">'主要是这句话进行修改下
<SPAN>
<br> <IMG src="pic/m_c.gif" />小目录<br>
</SPAN>
</SPAN>
</SPAN>
只需要在<div class="content" ><a href="http://www.alixixi.com">www.alixixi.com</a></div>这里改成<div class="content" style="display:none"><a href="http://www.alixixi.com">www.alixixi.com</a></div>
完整代码如下:
<!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/htmlcharset=utf-8" />
<style type="text/css">
*{margin:0padding:0}
body{ font-family:Arial, Helvetica, sans-seriffont-size:12pxcolor:#666}
#box{width:200pxborder:1px solid #ccc}
.title{ font-size:12pxpadding-left:3pxheight:20pxborder-bottom:1px solid #fffbackground:#000line-height:20pxcolor:#FFFcursor:pointer}
.content{ padding:5pxheight:150px}
</style>
<script type="text/javascript">
function flexMenu(id)
{
var $id = document.getElementById(id)
var titleList = $id.getElementsByTagName('h2')
var contentList = $id.getElementsByTagName('div')
titleList[titleList.length-1].style.border = 'none'
for(var i=0i<titleList.lengthi++)
{
titleList[i].onclick = function()
{
for(var a=0a<contentList.lengtha++)
{
contentList[a].style.display = 'none'
}
if(this.nextSibling.nodeType=='3')
{
this.nextSibling.nextSibling.style.display = ''
}else
{
this.nextSibling.style.display = ''
}
}
}
}
window.onload = function(){ flexMenu('box')}
</script>
<title>flex menu</title>
</head>
<body>
应有尽有的网页特效网址:<a href="http://js.alixixi.com">http://js.alixixi.com</a>
<hr />
<div id="box">
<h2 class="title">阿里西西</h2>
<div class="content" style="display:none"><a href="http://www.alixixi.com">www.alixixi.com</a></div>
<h2 class="title">站长工具</h2>
<div class="content" style="display:none"><a href="http://tool.alixixi.com">站长工具</a></div>
<h2 class="title">网页特效</h2>
<div class="content" style="display:none"><a href="http://js.alixixi.com">站长工具</a></div>
</div>
</body>
</html>
<!DOCTYPE html><html>
<head>
<meta charset="utf8">
<title>555</title>
<style type="text/css">
p {
width:100px
height:24px
overflow: hidden
text-overflow: ellipsis
white-space: nowrap
}
</style>
</head>
<body>
<p title="fhdniojacnjdikoeacnedioksanjkocnjdiwoqncdjiokanjkcodsnjaiocndjwioqjdcniosancjdosanjio">fhdniojacnjdikoeacnedioksanjkocnjdiwoqncdjiokanjkcodsnjaiocndjwioqjdcniosancjdosanjio</p>
</body>
<script type="text/JavaScript">
</script>
</html>
加一个 title属性,里面的值给你要显示的内容,这样的话鼠标放上去,会全部显示内容。
这应该是最简单的。
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)