And here is my very slick menu!
Toggle
<html>
<head>
<title>Javascript test</title>
<script language="javascript">
var active = 1;
var height = 100;
function toggle_visible() {
if(active == 0) {
active = 1;
divPlusOne();
} else if(active == 1){
active = 0;
divMinusOne();
}
}
function divPlusOne() {
if(height <= 100) {
document.getElementById('testDiv').style.visibility="visible";
height = height + 1;
document.getElementById('testDiv').style.height=height + 'px';
window.setTimeout('divPlusOne()', 1);
}
}
function divMinusOne() {
if(height >= 20) {
height = height - 1;
document.getElementById('testDiv').style.height=height + 'px';
window.setTimeout('divMinusOne()', 1);
} else {
document.getElementById('testDiv').style.visibility="hidden";
}
}
</script>
</head>
<body>
<div id="testDiv" style="border: #000000 1px solid; height: 100px;">And here is my very slick menu!</div>
<br />
<a href="#" onClick="toggle_visible()">Toggle</a><br />
<br />
</body>
</html>
[출처]http://micropilot.tistory.com/category/Javascript?page=75#
댓글 없음:
댓글 쓰기