تالار گفتمان مانشت
تغییرات در منو آکاردئونی نوشته شده با javascript - نسخه‌ی قابل چاپ

تغییرات در منو آکاردئونی نوشته شده با javascript - alirezaei - 09 فروردین ۱۳۹۴ ۰۸:۳۲ ب.ظ

سلام، من به یه منو آکاردوئونی احتیاج داشتم که منو اول اون به صورت پیش فرض باز باشه، اسکریپتی که برای این منو در حالت عادی دارم اینه که همه منو ها بسته است ، میخوام تغییرش بدم ، راهنمایی بفرمایید لطفا.
چند ماه پیش یکم روش وقت گذاشتم ولی به نتیجه ای نرسیدم و ولش کردم، الان دیگه امیدم به شماست.Wink

کد منو در حال حاضر:

کد php:
<script type="text/javascript">
//<![CDATA[
var contentHeight 34;
var 
TimeToSlide 300.0;
var 
openprobox '';
function 
runprobox(index){
    var 
divID "probox" index "content";
    if(
openprobox == divID){
        
divID '';
    }
    
setTimeout("animate(" + new Date().getTime() + "," TimeToSlide ",'" openprobox "','" divID "')"33);
    
openprobox divID;
}
function 
animate(lastTicktimeLeftclosingIdopeningId){
    var 
curTick = new Date().getTime();
    var 
elapsedTicks curTick lastTick;
    var 
opening = (openingId == '') ? null document.getElementById(openingId);
    var 
closing = (closingId == '') ? null document.getElementById(closingId);
    
    if(
timeLeft <= elapsedTicks){
        if(
opening != null){
            
opening.style.height contentHeight 'px';
        }
        if(
closing != null){
            
closing.style.display 'none';
            
closing.style.height '0px';
        }
    return;
    }
    
timeLeft -= elapsedTicks;
  var 
newClosedHeight Math.round((timeLeft/TimeToSlide) * contentHeight);
  if(
opening != null){
      if(
opening.style.display != 'block'){
          
opening.style.display 'block';
      }
      
opening.style.height = (contentHeight newClosedHeight) + 'px';
  }
  if(
closing != null){
      
closing.style.height newClosedHeight 'px';
  }
  
setTimeout("animate(" curTick "," timeLeft +",'" closingId "','" openingId "')"33);
}
//]]>
</script

این هم قسمت body

کد php:
<div id="proboxmain" class="proboxmain">
<!-- 
منوی شماره ۱ -->
  <
div class="proboxtitle" onclick="runprobox(1);">
  
تیتر باکس ۱
  
</div>
  <
div id="probox1content" class="proboxcontent">
  
محتوای باکس آکاردئونی ۱
  
</div>
<!-- 
منوی شماره ۲ -->  
  <
div class="proboxtitle" onclick="runprobox(2);">
  
تیتر باکس ۲
  
</div>
  <
div id="probox2content" class="proboxcontent">
  
محتوای باکس آکاردئونی ۲
  
</div>
<!-- 
منوی شماره ۳ -->  
  <
div class="proboxtitle" onclick="runprobox(3);">
  
تیتر باکس ۳
  
</div>
  <
div id="probox3content" class="proboxcontent">
  
محتوای باکس آکاردئونی ۳
  
</div>
<!-- 
منوی شماره ۴ -->  
  <
div class="proboxtitle" onclick="runprobox(4);">
  
تیتر باکس ۴
  
</div>
  <
div id="probox4content" class="proboxcontent">
  
محتوای باکس آکاردئونی ۴
  
</div>
</
div

این هم قسمت css مرتبط با منو

کد php:
<style type="text/css">
body{
    
font-family:TahomaGenevasans-serif;
    
font-size:12px;
    
direction:rtl;
}
.
proboxtitle, .proboxcontent, .proboxmain{
    
position:relative;
}
.
proboxtitle{
    
width:200px;    
    
height:25px;
    
overflow:hidden;
    
text-align:right;
    
display:block;
    
cursor:pointer;
    
background-color:#666;
    
color:#FFF;
    
direction:rtl;
    
padding:4px;
    
text-align:center;
    
border-bottom:1px dashed #CCC;    
}
.
proboxcontent{
    
width:200px;    
    
height:auto;
    
overflow:hidden;
    
display:none;
    
background-color:#F8F8F8;
    
padding:4px;
    
direction:rtl;
}
.
proboxmain{
    
border:1px solid #F0F0F0;
    
width:208px;    
}
</
style


RE: تغییرات در منو آکاردئونی نوشته شده با jscript - MiladCr7 - 09 فروردین ۱۳۹۴ ۱۰:۱۷ ب.ظ

سلام به اول کد جاوا اسکریپتتون این رو اضافه کنید ببینید شکل مد نظرتون این نیست!!
کد php:
window.onload = function () {
    
runprobox(1);



تغییرات در منو آکاردئونی نوشته شده با javascript - alirezaei - 09 فروردین ۱۳۹۴ ۱۱:۲۹ ب.ظ

(۰۹ فروردین ۱۳۹۴ ۱۰:۱۷ ب.ظ)MiladCr7 نوشته شده توسط:  سلام به اول کد جاوا اسکریپتتون این رو اضافه کنید ببینید شکل مد نظرتون این نیست!!
کد php:
window.onload = function () {
    
runprobox(1);



درست شد!!!Smile به همین سادگی(البته برا شما که بلدی) آقا خیلی ممنون.Cool

یبار از onload استفاده کردم تو این قسمت
کد php:
<div class="proboxtitle" onload="runprobox(1);"
اصن منو اول باز نمیشد ، از event های دیگه هم که استفاده میکردم منو اول تند تند باز و بسته میشد. ExclamationExclamation
وارد نبودن تو جاوا اسکریپت باعث دردسر است!!!