js菜单效果
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="DetailInHouse.aspx.cs" Inherits="user_vip_DetailInHouse" %>
<!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 id="Head1" runat="server">
<title>富易股票</title>
<meta name="keywords" content="股票,A股,大盘,散户,股票公司">
<meta name="description" content="关于富易介绍。">
<link href="../css/font.css" rel="stylesheet" type="text/css" />
<link href="../css/indexcss.css" rel="stylesheet" type="text/css" />
<style type="text/css">
/* common styling */
/* set up the overall width of the menu div, the font and the margins */
.menu {
font-family: arial, sans-serif;
width:730px;
margin:0;
margin:0px 0;
}
/* remove the bullets and set the margin and padding to zero for the unordered list */
.menu ul {
padding:0;
margin:0;
list-style-type: none;
}
/* float the list so that the items are in a line and their position relative so that the drop down list will appear in the right place underneath each list item */
.menu ul li {
float:left;
position:relative;
}
/* style the links to be 104px wide by 30px high with a top and right border 1px solid white. Set the background color and the font size. */
.menu ul li a, .menu ul li a:visited {
display:block;
text-align:center;
text-decoration:none;
width:90px;
height:30px;
color:#000;
border:1px solid #fff;
border-width:1px 1px 0 0;
background:#c9c9a7;
line-height:30px;
font-size:11px;
}
/* make the dropdown ul invisible */
.menu ul li ul {
display: none;
}
/* specific to non IE browsers */
/* set the background and foreground color of the main menu li on hover */
.menu ul li:hover a {
color:#fff;
background:#b3ab79;
}
/* make the sub menu ul visible and position it beneath the main menu list item */
.menu ul li:hover ul {
display:block;
position:absolute;
top:30px;
left:0;
width:105px;
}
/* style the background and foreground color of the submenu links */
.menu ul li:hover ul li a {
display:block;
background:#faeec7;
color:#000;
}
/* style the background and forground colors of the links on hover */
.menu ul li:hover ul li a:hover {
<%--background:#dfc184; --%>
color:red;
}
</style>
<script type="text/javascript">
function showDiv()
{
var divcontent = document.getElementById("content");
var divgg = document.getElementById("gg");
var divjj=document.getElementById("jj");
if(divgg.style.display =="none")
{
divcontent.style.display ="none";
divgg.style.display="";
divjj.style.display="none";
}
}
function showjj()
{
var divcontent = document.getElementById("content");
var divgg = document.getElementById("gg");
var divjj=document.getElementById("jj");
if(divjj.style.display =="none")
{
divcontent.style.display ="none";
divgg.style.display="none";
divjj.style.display="";
}
}
function showCon()
{
var divcontent = document.getElementById("content");
var divgg = document.getElementById("gg");
var divjj=document.getElementById("jj");
if(divcontent.style.display =="none")
{
divcontent.style.display ="";
divgg.style.display="none";
divjj.style.display="none";
}
}
</script>
</head>
<body oncontextmenu="return false" ondragstart="return false" onselectstart ="return false" onselect="document.selection.empty()" oncopy="document.selection.empty()" onbeforecopy="return false">
<form id="form1" runat="server">
<div class="list">
<div class="listlf" style="width:730px;">
<div class="listlf1n" style="width:728px; height:494px; overflow:hidden;">
<asp:Repeater ID="Repeater1" runat="server">
<ItemTemplate>
<div class="listlf1nbt1" style="color:#CC1100; width:700px;">★<%#Eval("Title")%>（<%#DateTime.Parse(Eval("ReaderTime").ToString()).ToString("MM月dd日") %>）★</div>
<div class="listlftime" style="font-size:14px; width: 712px;">发布时间：<%#DateTime.Parse(Eval("AddTime").ToString()).ToString("MM月dd日 HH：mm") %> </div>
<div class="menu" style="text-align:center; padding-bottom:5px;">
<ul>
<li><a class="hide" href="#GuShi" onclick="showCon();" >股市日历</a>
<ul>
<li><a href="#GaongGao" onclick="showDiv();">公告信息</a></li>
<li><a href="#GongKai" onclick="showCon();">公开交易信息</a></li>
<li><a href="#JieJin" onclick="showjj();">解禁提示</a></li>
<li><a href="#TeBie" onclick="showCon();">特别提示</a></li>
</ul>
</li>
<li><a class="hide" href="#YaoWen" onclick="showCon();">要闻分析</a>
</li>
<li><a class="hide" href="#ReDian" onclick="showCon();">热点追踪</a>
</li>
<li><a class="hide" href="#ShiChang" onclick="showCon();">市场策略</a>
</li>
<li><a class="hide" href="#GuanZhu" onclick="showCon();">关注行业</a>
</li>
<li><a class="hide" href="#GeGu" onclick="showCon();">个股研究</a>
</li>
<li><a class="hide" href="#JinRong" onclick="showCon();">金融衍生品动态</a>
<ul>
<li><a href="#GuZhi" onclick="showCon();">股指期货</a></li>
<li><a href="#QuanZheng" onclick="showCon();">权证</a></li>
</ul>
</li>
<li><a class="hide" href="#WaiWei" onclick="showCon();">外围市场</a>
</li>
</ul>
</div>
<div id="content" class="listcont" style="text-indent:2em;border:solid 1px #cccccc; width:690px; height:350px; padding-top:2px;OVERFLOW:auto; "><%#Eval("Content")%>
<div style="height:120px"></div>
<h2>(股市有风险，入市需谨慎)</h2>
</div>
</ItemTemplate>
</asp:Repeater>
<div id="gg" style=" display:none"><asp:Label ID="labGG" runat="server"></asp:Label></div>
<div id="jj" style="display:none"><asp:Label ID="labJJ" runat="server"></asp:Label></div>
</div>
</div>
</div>
</form>
</body>
</html>
