如何用js代码实现二级菜单和图片轮播，求大神帮助 30

二级菜单<li><ahref="#"onMouseMove="changes()">Shortcodes</a><ulid="shortcodes"><li><a>Col... 二级菜单
<li>
<a href="#" onMouseMove="changes()">Shortcodes</a>
<ul id="shortcodes">
<li>
<a>Columns</a>
</li>
<li>
<a>Elements</a>
</li>
<li>
<a>Typography</a>
</li>
</ul>
</li>
<li>
<a href="#" onMouseMove="changep()" onMouseOut="changepp()">Portfolio</a>
<ul id="portfolio" style="display:none">
<li>
<a href="./portfolio.htm.html">Portfolio Image</a>
</li>
<li>
<a href="./portfolio-video.htm.html">Portfolio Video</a>
</li>
<li>
<a href="./portfolio-other.htm.html">Portfolio Other</a>
</li>
</ul>
</li>
图片轮播
<div id="slider">
<ul class="slider_photos">
<li>
<div class="inside">
<div class="description page_text">
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. <a href="#">Leo in faucibus orci</a> luctus leo nec felis facilisis libero. Sed non eros. Vivamus iaculis, purus est!</p>
</div>
<img src="./img/examples/top_1.jpg" alt="" />
</div>
</li>
<li>
<div class="inside">
<div class="description page_text">
<p>Mauris sit amet dolor velit, at condimentum ante. Donec at justo lorem, id feugiat dui. <a href="#">Quisque tincidunt</a> pulvinar sodales. Nullam luctus arcu quis mi pulvinar interdum. Aenean accumsan orci vel diam sagittis interdum.</p>
</div>
<img src="./img/examples/top_2.jpg" alt="" />
</div>
</li>
</ul>
<nav class="arrows">
<a class="next"></a>
<a class="prev"></a>
</nav>
<div class="progressbar">
<div class="bar"></div>
</div>
</div>
求大神帮助啊！！展开

 我来答

2个回答

#热议# 空调使用不当可能引发哪些疾病？

依然可唯
2014-06-05

知道答主

回答量：11

采纳率：0%

帮助的人：1.2万

我也去答题访问个人页

关注

展开全部

图片轮播
 <html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>图片轮换</title>
</head>

<body>
<script type="text/javascript">
var i=0;
var arr =new Array(3);
arr[0]="<img border=0 width=400 height=240 src=images/pic1.jpg />";
arr[1]="<img border=0 width=400 height=240 src=images/pic2.jpg />";
arr[2]="<img border=0 width=400 height=240 src=images/pic3.jpg />";
function playTp(){
   if (i==2){i=0;}
   else{i++;}
   div1.filters[0].apply();
   div1.innerHTML=arr[i];
   div1.filters[0].play();
   setTimeout('playTp()',6000);
}
</script>
<p><div id="div1" style="filter:revealtrans(duration=2,transition=23);WIDTH:400px;POSITION:absolute;HEIGHT:240px">
<img src="images/pic1.jpg" onload="setTimeout('playTp()',3000);" border="0" width="400" height="240">

</div>

</body>
</html>
二级菜单
<!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>

<script type="text/javascript"><!--//--><![CDATA[//><!--
startList = function() {
if (document.all&&document.getElementById) {
navRoot = document.getElementById("menu");
var allli = navRoot.getElementsByTagName("li")
for (i=0; i<allli.length; i++) {
node = allli[i];
node.onmouseover=function() {
this.className+=" current";
}
node.onmouseout=function() {
this.className=this.className.replace(" current", "");
}
}
}
}
window.onload=startList;
//--><!]]></script>

<style type="text/css">
<!--
#menu ul {
	margin: 0px;
	padding: 0px;
	list-style-type: none;
}
#menu {
	border: 1px solid #999999;
	width: 200px;
	text-align: center;
}
#menu ul li {

	height: 36px;
	padding-top: 0px;
	padding-right: 8px;
	padding-bottom: 0px;
	padding-left: 8px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #CCC;
	line-height: 36px;
	position: relative;
}
#menu ul a {
	color: #666666;
	text-decoration: none;
}
#menu ul a:hover {
	color: #CC3300;
	
}
body {
	font-family: "宋体";
	font-size: 14px;
	font-weight: bold;
}
#menu ul ul {
	position: absolute;
	visibility: hidden;
	left: 200px;
	top: 0px;
	border: 1px solid #CCC;
	background-image: url(images/bgc_2.jpg);
	background-repeat: no-repeat;
	background-position: right;
}
#menu ul ul li {
	line-height: 26px;
	height: 26px;
	width: 150px;
	filter: Alpha(Opacity=50, FinishOpacity=80, Style=50, StartX=200, StartY=, FinishX=, FinishY=);
}
#menu .left {
	background-image: url(images/bgc_1.jpg);
	background-repeat: no-repeat;
	background-position: left bottom;
}
#menu ul li.current ul {
	visibility: visible;
}
#menu ul li:hover ul {
	visibility: visible;
}
#menu ul li:hover{
	background-image: url(images/bgc_4.jpg);
	background-repeat: no-repeat;
}
-->
</style>
</head>

<body>
<div id="menu">
    <div><img src="images/daohang.png"  width="200" height="36"/></div>
    <div class="left">
       <ul>
       <li><a href="#">系部导航</a></li>
       <li><a href="#">组织机构</a>
	       <ul>
		   <li><a href="#">学生办公室</a></li>
    	   <li><a href="#">人事处</a></li>
		   <li><a href="#">总务处</a></li>
    	   <li><a href="#">财务处</a></li>
		   <li><a href="#">保卫处</a></li>
	       </ul>
	   </li>
       <li><a href="#">职业培训</a></li>
       <li><a href="#">图书馆式</a></li>
	   <li><a href="#">实训基地</a></li>
	   <li><a href="#">E-learning</a></li>
	   <li><a href="#">学生风采</a></li>
	   <li><a href="#">信息公开</a></li>
	   <li><a href="#">专业建设发展栏</a></li>
       </ul>
    </div>
</div>
</body>
</html>


本回答被网友采纳






已赞过已踩过<

你对这个回答的评价是？
评论收起

a410463439
2014-06-04

知道答主

回答量：11

采纳率：0%

帮助的人：3.9万

我也去答题访问个人页

关注

展开全部

百度一堆看下就知道了

已赞过 已踩过<

评论收起

1条折叠回答

推荐律师服务：若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询

如何用js代码实现二级菜单和图片轮播，求大神帮助 30

其他类似问题

为你推荐：