منوی کرکره‌ای چند مرحله ای!؟!؟

H

hawram_sh

Member
سلام دوستان من یه منوی کرکره‌ ای جاوا چند مرحله‌ای میخوام. به این صورت ابتدا شخص در منوی اول مثلا استان را انتخاب، سپس در منوی دوم شهرستان و در منوی سوم بخش را و سپس با زدن دکمه ارسال وارد صفحه مطابق با اون سه انتخاب خودش بشه.
 
sharktech

sharktech

کاربر فعال
این چیزی که شما می خواین نیاز به برنامه نویسی داره.

و باید از php و js توش استفاده کرد.
 
sranimation

sranimation

Member
hawram_sh گفت:
سلام دوستان من یه منوی کرکره‌ ای جاوا چند مرحله‌ای میخوام. به این صورت ابتدا شخص در منوی اول مثلا استان را انتخاب، سپس در منوی دوم شهرستان و در منوی سوم بخش را و سپس با زدن دکمه ارسال وارد صفحه مطابق با اون سه انتخاب خودش بشه.
کلیک کنید تا باز شود...

منطورت همچین چیزیه؟

کد: 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>

<style type="text/css">

.sidebarmenu ul{
margin: 0;
padding: 0;
list-style-type: none;
font: bold 13px Verdana;
width: 150px; 
border-bottom: 1px solid #ccc;
float:right;
text-align:right;
}
 
.sidebarmenu ul li{
position: relative;
}

.sidebarmenu ul li a{
display: block;
overflow: auto;
color: white;
text-decoration: none;
padding: 6px;
border-bottom: 1px solid #778;
border-right: 1px solid #778;
}

.sidebarmenu ul li a:link, .sidebarmenu ul li a:visited, .sidebarmenu ul li a:active{
background-color:#009FFF;
}

.sidebarmenu ul li a:visited{
color: white;
}

.sidebarmenu ul li a:hover{
background-color:#007FAA;
}


.sidebarmenu ul li ul{
position: absolute;
width: 120px; 
top: 0;
visibility: hidden;
}

.sidebarmenu a.subfolderstyle{
background: url(right.gif) no-repeat 97% 50%;
}

 

* html .sidebarmenu ul li { float: left; height: 1%; }
* html .sidebarmenu ul li a { height: 1%; }


</style>

<script type="text/javascript">


var menuids=["sidebarmenu1"] 

function initsidebarmenu(){
for (var i=0; i<menuids.length; i++){
  var ultags=document.getElementById(menuids[i]).getElementsByTagName("ul")
    for (var t=0; t<ultags.length; t++){
    ultags[t].parentNode.getElementsByTagName("a")[0].className+=" subfolderstyle"
  if (ultags[t].parentNode.parentNode.id==menuids[i]) 
   ultags[t].style.right=ultags[t].parentNode.offsetWidth+"px"
  else
    ultags[t].style.right=ultags[t-1].getElementsByTagName("a")[0].offsetWidth+"px" 
    ultags[t].parentNode.onmouseover=function(){
    this.getElementsByTagName("ul")[0].style.display="block"
    }
    ultags[t].parentNode.onmouseout=function(){
    this.getElementsByTagName("ul")[0].style.display="none"
    }
    }
  for (var t=ultags.length-1; t>-1; t--){
  ultags[t].style.visibility="visible"
  ultags[t].style.display="none"
  }
  }
}

if (window.addEventListener)
window.addEventListener("load", initsidebarmenu, false)
else if (window.attachEvent)
window.attachEvent("onload", initsidebarmenu)

</script>


</head>

<body>

<div class="sidebarmenu">
<ul id="sidebarmenu1">

<li><a href="#">استان اول</a>
  <ul>
  <li><a href="#">شهرستان اول</a>
    <ul>
    <li><a href="#">بخش اول</a></li>
    <li><a href="#">بخش دوم</a></li>
    <li><a href="#">بخش سوم</a></li>
    <li><a href="#">بخش چهارم</a></li>
    </ul>
  </li>
  <li><a href="#">شهرستان دوم</a>
    <ul>
    <li><a href="#">بخش اول</a></li>
    <li><a href="#">بخش دوم</a></li>
    </ul>
  </li>
</ul>
</li>

<li><a href="#">استان دوم</a>
  <ul>
  <li><a href="#">شهرستان اول</a>
    <ul>
    <li><a href="#">بخش اول</a></li>
    </ul>
  </li>
  <li><a href="#">شهرستان دوم</a>
    <ul>
    <li><a href="#">بخش اول</a></li>
    <li><a href="#">بخش دوم</a></li>
	<li><a href="#">بخش سوم</a></li>
    </ul>
  </li>
</ul>
</li>


<li><a href="#">استان سوم</a>
  <ul>
  <li><a href="#">شهرستان اول</a>
    <ul>
    <li><a href="#">بخش اول</a></li>
    <li><a href="#">بخش دوم</a></li>
    <li><a href="#">بخش سوم</a></li>
    <li><a href="#">بخش چهارم</a></li>
    </ul>
  </li>
  <li><a href="#">شهرستان دوم</a>
    <ul>
    <li><a href="#">بخش اول</a></li>
    <li><a href="#">بخش دوم</a></li>
    </ul>
  </li>
    <li><a href="#">شهرستان سوم</a>
    <ul>
    <li><a href="#">بخش اول</a></li>
    <li><a href="#">بخش دوم</a></li>
    <li><a href="#">بخش سوم</a></li>
    </ul>
  </li>
</ul>
</li>


</ul>
</div>


</body>
</html>
 
برای ارسال پاسخ شما باید وارد سیستم شوید.

آخرین مطالب مجیدآنلاین

جدیدترین ارسال ها

بالا