86 lines
2.9 KiB
HTML
86 lines
2.9 KiB
HTML
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
|
|
<html>
|
|
<head>
|
|
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
|
|
<title>Accordion Example</title>
|
|
|
|
<script type="text/javascript" src="/extras/yui/build/yahoo/yahoo-min.js"></script>
|
|
<script type="text/javascript" src="/extras/yui/build/event/event-min.js"></script>
|
|
<script type="text/javascript" src="/extras/yui/build/dom/dom-min.js"></script>
|
|
<script type="text/javascript" src="/extras/yui/build/animation/animation-min.js"></script>
|
|
<script type="text/javascript" src="/extras/yui-webgui/accordion.js"></script>
|
|
<link type="text/css" rel="stylesheet" href="/extras/yui-webgui/resources/css/accordion.css" />
|
|
|
|
<script type="text/javascript">
|
|
YAHOO.util.Event.addListener(window, 'load', function () {var myAccordion = new Accordion("myAccordion");} );
|
|
</script>
|
|
|
|
<style type="text/css" media="screen">
|
|
.accordion {
|
|
width: 300px;
|
|
border: 1px solid #999999;
|
|
font-family: Helvetica,Arial,sans-serif;
|
|
font-size: 12px;
|
|
color: #000000;
|
|
}
|
|
|
|
.accordionHeader {
|
|
height: 16px;
|
|
background-color: #CFD8E4;
|
|
border: 1px solid #999999;
|
|
font-size: 14px;
|
|
padding: 1px 0px 1px 3px;
|
|
}
|
|
|
|
.accordionBody {
|
|
padding: 0px 2px;
|
|
background-color: #EEEEEE;
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
|
|
<div id="myAccordion" class="accordion">
|
|
<div class="accordionItem">
|
|
|
|
<div class="accordionHeader">accordion header 1</div>
|
|
<div class="accordionBody">
|
|
accordion 1 accordion 1 accordion 1 accordion 1
|
|
accordion 1 accordion 1 accordion 1 accordion 1
|
|
accordion 1 accordion 1 accordion 1 accordion 1
|
|
accordion 1 accordion 1 accordion 1 accordion 1
|
|
accordion 1 accordion 1 accordion 1 accordion 1
|
|
accordion 1 accordion 1 accordion 1 accordion 1
|
|
</div>
|
|
</div>
|
|
<div class="accordionItem">
|
|
<div class="accordionHeader">accordion header 2</div>
|
|
<div class="accordionBody">
|
|
|
|
accordion 2 accordion 2 accordion 2 accordion 2
|
|
accordion 2 accordion 2 accordion 2 accordion 2
|
|
accordion 2 accordion 2 accordion 2 accordion 2
|
|
accordion 2 accordion 2 accordion 2 accordion 2
|
|
accordion 2 accordion 2 accordion 2 accordion 2
|
|
accordion 2 accordion 2 accordion 2 accordion 2
|
|
accordion 2 accordion 2 accordion 2 accordion 2
|
|
accordion 2 accordion 2 accordion 2 accordion 2
|
|
accordion 2 accordion 2 accordion 2 accordion 2
|
|
accordion 2 accordion 2 accordion 2 accordion 2
|
|
accordion 2 accordion 2 accordion 2 accordion 2
|
|
accordion 2 accordion 2 accordion 2 accordion 2
|
|
accordion 2 accordion 2 accordion 2 accordion 2
|
|
accordion 2 accordion 2 accordion 2 accordion 2
|
|
accordion 2 accordion 2 accordion 2 accordion 2
|
|
accordion 2 accordion 2 accordion 2 accordion 2
|
|
</div>
|
|
</div>
|
|
<div class="accordionItem">
|
|
<div class="accordionHeader">accordion header 3</div>
|
|
<div class="accordionBody">accordion body 3</div>
|
|
</div>
|
|
</div>
|
|
|
|
</body>
|
|
</html>
|
|
|