Здравствуйте, имеется вот такой вот скрипт открытия и закрытия <div>
|
Код:
|
<html>
<head>
<title>Пример</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<script type="text/javascript" src="jquery-1.4.2.min.js"></script>
<script>
function one (objName) {
if ( $(objName).css('display') == 'none' ) {
$(objName).animate({height: 'show'}, 400);
} else {
$(objName).animate({height: 'hide'}, 200);
}
}
function two (objName) {
if ( $(objName).css('display') == 'none' ) {
$(objName).animate({height: 'show'}, 400);
} else {
$(objName).animate({height: 'hide'}, 200);
}
}
</script>
<style type="text/css">
body {
background-color: #ffa999;
}
#1 {
background-color: #ffffff;
margin-left: 20%;
width: 70%;
border-radius: 4px;
border: 1px solid black;
}
#2 {
background-color: #ffffff;
margin-left: 20%;
width: 70%;
border-radius: 4px;
border: 1px solid black;
}
ul {
background-color: #ffffff;
border-radius: 4px;
border: 1px solid black;
text-align: left;
width: 15%;
position: absolute;
}
</style>
</head>
<body>
<ul>
<li><a href="#" onclick="one('#1'); return false">Пример №1</a></li>
<li><a href="#" onclick="two('#2'); return false">Пример №2</a></li>
</ul>
<div id="1" style="display: none">
Пример №1</br>
Пример №1</br>
Пример №1</br>
Пример №1</br>
</div>
<div id="2" style="display: none">
Пример №2</br>
Пример №2</br>
Пример №2</br>
Пример №2</br>
</div>
</body>
</html> |
Подскажите пожалуйста, как мне сделать так, чтобы сразу два блока не могли были открыты, т.е. при открытии одного сначала закрывался уже открытый, а только потом открывался запрашиваемый блок.