1.手拉式菜单构建

来源:互联网 发布:淘宝物美价廉女装品牌 编辑:程序博客网 时间:2024/06/02 04:23

记录还是依旧简洁的源码

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%><%String path = request.getContextPath();String basePath = request.getScheme() + "://"+ request.getServerName() + ":" + request.getServerPort()+ path + "/";%><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html><head><base href="<%=basePath%>"><title>My JSP 'MyJsp.jsp' starting page</title><meta http-equiv="pragma" content="no-cache"><meta http-equiv="cache-control" content="no-cache"><meta http-equiv="expires" content="0"><meta http-equiv="keywords" content="keyword1,keyword2,keyword3"><meta http-equiv="description" content="This is my page"><!--<link rel="stylesheet" type="text/css" href="styles.css">--><script type="text/javascript" src="jquery/jquery-1.8.2.min.js"></script><script type="text/javascript">$(document).ready(function(){ var count=0;$("div").hide(); $("input").after("</br>").click(function(event){count++;var index=1;index=index<<(parseInt(this.name)-1);var dname=["#div1","#div2","#div3","#div4"];if(index!=0){$("div").hide("fast");$(dname[(parseInt(this.name)-1)]).show("slow","linear",function(){ $("body").attr("bgcolor","#ffffff");});//或者使用slideDown更逼真}  }); });</script><style type="text/css">input {width: 80px;height: 30px;}div {width: 400px;height: 200px;}</style></head><body><input type="button" value="在线好友" class="button1" name="1"/><div style="background-color:  #ff0000" id="div1"></div><input type="button" value="电子131" class="button2" name="2"/><div style="background-color:  #00f00f" id="div2"></div><input type="button" value="电子132" class="button3" name="3"/><div style="background-color:  #f0ff00" id="div3"></div><input type="button" value="电子133" class="button4" name="4"/><div style="background-color:  #f00ff0" id="div4"></div></body></html>


0 0
原创粉丝点击