js دانلود فایل جاوا اسکریپت

<script type="text/javascript">
animatedcollapse.addDiv('am1', 'fade=0,speed=400,group=animated')
animatedcollapse.addDiv('am2', 'fade=0,speed=400,group=animated,persist=1,hide=1')
animatedcollapse.addDiv('am3', 'fade=0,speed=400,group=animated,hide=1')
animatedcollapse.ontoggle=function($, divobj, state){ //fires each time a DIV is expanded/contracted
}
animatedcollapse.init()
</script>
<style type="text/css">
.padd {
display:inline-block;
padding:0px;
margin:10px;
width:420px;
border:2px #c0c0c0 solid;
min-height:20px;
box-shadow: 0px 0px 2px rgba(200, 200, 200, 0.1);
-moz-box-shadow: 0px 0px 2px rgba(200, 200, 200, 0.1);
-o-box-shadow: 0px 0px 2px rgba(200, 200, 200, 0.1);
-khtml-box-shadow: 0px 0px 2px rgba(200, 200, 200, 0.1);
-webkit-box-shadow: 0px 0px 2px rgba(200, 200, 200, 0.1);
-moz-border-radius: 6px;
-webkit-border-radius: 6px;
border-radius: 6px;
-khtml-border-radius: 6px;
}
.anim {
width: 400px;
background:#333333;
color:#FFFFFF;
margin:10px;
}
</style>
</head>
<body>
<div id="page">
<div class="nav">
<a href="javascript:animatedcollapse.show('am1')">گشودن</a><a href="#" rel="toggle[am1]" data-openimage="http://css3.xzn.ir/jsscripts/collapse.jpg" data-closedimage="http://css3.xzn.ir/jsscripts/expand.jpg"><img src="http://css3.xzn.ir/jsscripts/expand.jpg" border="0" /></a> <a href="javascript:animatedcollapse.hide('am1')">بستن</a>
</div>
<div class="padd" id="p1">
<div id="am1" class="anim">
این کادر یک محل نمونه برای متنی است که قرار است در اولین جعبه به نمایش در آید شما ممکن است بخواهید در این متن<strong> بخشی را برجسته نمایید </strong>یا <a href="http://fakharblog.ir" target="_blank">پیوندی</a> به یک سایت دیگر ایجاد کنید در این جعبه که لایه ای از جنس div است شما می توانید از تمام کدهای html و خواص css استفاده نمایید
</div>
</div>



<p><b>جعبه دوم (نمونه):</b></p>
<div class="nav">
<a href="javascript:animatedcollapse.show('am2')">گشودن</a><a href="#" rel="toggle[am2]" data-openimage="http://css3.xzn.ir/jsscripts/collapse.jpg" data-closedimage="http://css3.xzn.ir/jsscripts/expand.jpg"><img src="http://css3.xzn.ir/jsscripts/collapse.jpg" border="0" /></a> <a href="javascript:animatedcollapse.hide('am2')">بستن</a>
</div>
<div class="padd" id="p2">
<div id="am2" class="anim">
شما می توانید به عنوان مثال در یک جعبه فرم تماس با ما قرار دهید مانند

<table align="center" cellpadding="5" cellspacing="0" dir="rtl" style="width: 250px">
<tr>
<td>نام</td>
<td>

<input id="name" type="text" value="نام شما" />
</td>
</tr>
<tr>
<td>ایمیل</td>
<td>
<input id="email" type="text" value="mail@mailbox.com" />
</td>
</tr>
<tr>
<td colspan="2">
<textarea cols="20" id="textarea1" rows="2">متن پیام</textarea>
</td>
</tr>
<tr>
<td colspan="2">
<input name="Submit1" onclick="animatedcollapse.show('am3');form2()" type="button" value="submit" />
</td>
</tr>
</table>

</div>
</div>



<p><b>بخش سوم:</b></p>
<div class="nav">

<a href="javascript:animatedcollapse.show('am3')">گشودن</a> <a href="#" rel="toggle[am3]" data-openimage="http://css3.xzn.ir/jsscripts/collapse.jpg" data-closedimage="http://css3.xzn.ir/jsscripts/expand.jpg"><img src="http://css3.xzn.ir/jsscripts/collapse.jpg" border="0" /></a> <a href="javascript:animatedcollapse.hide('am3')">بستن</a>
</div>
<div class="padd" id="p3">
<div id="am3" class="anim">

<table style="width: 100%">
<tr>
<td>نام</td>
<td id="n1">&nbsp;</td>
</tr>
<tr>
<td>ایمیل</td>
<td id="e1">&nbsp;</td>
</tr>
<tr>
<td>متن پیام</td>
<td id="t1">&nbsp;</td>
</tr>
</table>

</div>
</div>
<script type="text/javascript">
<!--
function form2()
{
var n =document.getElementById('name').value;
var e =document.getElementById('email').value;
var t = document.getElementById('textarea1').value;
document.getElementById('n1').innerHTML=n;
document.getElementById('e1').innerHTML='<a href="mailto:'+e+'">'+e+'</a>';
document.getElementById('t1').innerHTML =t;
}
//-->
</script>

</div>


۳ پاسخ برای “باز و بسته شدن با jquery”

موبایلتو شارژ کن