مشکل در ایجاد اسلایدر

Mehdi.Jalali

کاربر تازه وارد
تازه وارد
سلام دوستان
من یه اسلایدر متنی درست کردم که 5 تا باکس داره ولی یه مشکلی دارم:
1- وقتی تو باکس اول هستم، دکمه بعدی و دکمه قبلی کار می کنه. (بدون مشکل)
2- وقتی تو باکس دوم هستم، دکمه بعدی و دکمه قبلی کار می کنه. (بدون مشکل)
3- وقتی تو باکس سوم هستم، دکمه بعدی کار می کنه ولی دکمه قبلی کار نمی کنه.
4- وقتی تو باکس چهارم هستم، دکمه بعدی و دکمه قبلی کار "نمی کنه"
1- وقتی تو باکس پنجم هستم، دکمه بعدی و دکمه قبلی کار "نمی کنه" و تنها راه رفتن به باکس پنجم کلیک روی دکمه بازگشت باکس یک هست.


این هم کد من هست:


جی کوئری:
کد:
[LEFT][INDENT]<script type="text/javascript">
	$(document).ready(function(e) {
		$("#box1").show()
        $("#box2").hide()
        $("#box3").hide()
        $("#box4").hide()
        $("#box5").hide()
		
		$("#bx1").click(function(e) {
		  $("#box1").show()
		  $("#box2").hide()
		  $("#box3").hide()
		  $("#box4").hide()
		  $("#box5").hide()
		});
		
		$("#bx2").click(function(e) {
		  $("#box1").hide()
		  $("#box2").show()
		  $("#box3").hide()
		  $("#box4").hide()
		  $("#box5").hide()
		});
		
		$("#bx3").click(function(e) {
		  $("#box1").hide()
		  $("#box2").hide()
		  $("#box3").show()
		  $("#box4").hide()
		  $("#box5").hide()
		});
		
		$("#bx4").click(function(e) {
		  $("#box1").hide()
		  $("#box2").hide()
		  $("#box3").hide()
		  $("#box4").show()
		  $("#box5").hide()
		});
		
		$("#bx5").click(function(e) {
		  $("#box1").hide()
		  $("#box2").hide()
		  $("#box3").hide()
		  $("#box4").hide()
		  $("#box5").show()
		});
		
    });
</script>
[/INDENT][/LEFT]

اچ تی ام ال:

کد:
[LEFT][INDENT]<div id="left-panel">

<!------------ box 1 ------------>
<div id="box1">
   
	<div class="tilte-lp">
    چگونه افزونه های پر کاربرد را به صورت یکجا نصب کنیم؟
    </div>
    
	<div class="text-lp">
    خیلی از ما سایت های مختلفی را با وردپرس راه اندازی میکنیم و در تمام این سایت هایک سری افزونه های تکراری و پر کاربرد را نصب می کنیم. قصت داریم در این مقاله نحوه نصب کلی این افزونه هارا آموزش دهیمتا برای سایت های جدیدی که قرار است راه اندازی کنیم از همین بسته استفاده کنیم.<br>ادامه مطلب...
   </div>
   
   <div class="lpanel-btn">
	<img id="bx2" src="http://progforum.ir/images/right-btn1.png" width="29" height="29">
	<img id="bx5" src="http://progforum.ir/images/left-btn1.png" width="29" height="29"> 
	</div>
    
</div>

<!------------ box 2 ------------>
<div id="box2">
   
	<div class="tilte-lp">
    عنوان دوم
    </div>
    
	<div class="text-lp">
        خیلی از ما سایت های مختلفی را با وردپرس راه اندازی میکنیم و در تمام این سایت هایک سری افزونه های تکراری و پر کاربرد را نصب می کنیم. قصت داریم در این مقاله نحوه نصب کلی این افزونه هارا آموزش دهیمتا برای سایت های جدیدی که قرار است راه اندازی کنیم از همین بسته استفاده کنیم.<br>ادامه مطلب...
   </div>
   
   <div class="lpanel-btn">
	<img id="bx3" src="http://progforum.ir/images/right-btn1.png" width="29" height="29">
	<img id="bx1" src="http://progforum.ir/images/left-btn1.png" width="29" height="29"> 
	</div>
    
</div>

<!------------ box 3 ------------>
<div id="box3">
   
	<div class="tilte-lp">
    عنوان سوم
    </div>
    
	<div class="text-lp">
        خیلی از ما سایت های مختلفی را با وردپرس راه اندازی میکنیم و در تمام این سایت هایک سری افزونه های تکراری و پر کاربرد را نصب می کنیم. قصت داریم در این مقاله نحوه نصب کلی این افزونه هارا آموزش دهیمتا برای سایت های جدیدی که قرار است راه اندازی کنیم از همین بسته استفاده کنیم.<br>ادامه مطلب...
   </div>
   
   <div class="lpanel-btn">
	<img id="bx4" src="http://progforum.ir/images/right-btn1.png" width="29" height="29">
	<img id="bx2" src="http://progforum.ir/images/left-btn1.png" width="29" height="29"> 
	</div>
    
</div>

<!------------ box 4 ------------>
<div id="box4">
   
	<div class="tilte-lp">
    عنوان چهارم
    </div>
    
	<div class="text-lp">
        خیلی از ما سایت های مختلفی را با وردپرس راه اندازی میکنیم و در تمام این سایت هایک سری افزونه های تکراری و پر کاربرد را نصب می کنیم. قصت داریم در این مقاله نحوه نصب کلی این افزونه هارا آموزش دهیمتا برای سایت های جدیدی که قرار است راه اندازی کنیم از همین بسته استفاده کنیم.<br>ادامه مطلب...
   </div>
   
   <div class="lpanel-btn">
	<img id="bx5" src="http://progforum.ir/images/right-btn1.png" width="29" height="29">
	<img id="bx3" src="http://progforum.ir/images/left-btn1.png" width="29" height="29"> 
	</div>
    
</div>

<!------------ box 5 ------------>
<div id="box5">
   
	<div class="tilte-lp">
    عنوان پنجم
    </div>
    
	<div class="text-lp">
        خیلی از ما سایت های مختلفی را با وردپرس راه اندازی میکنیم و در تمام این سایت هایک سری افزونه های تکراری و پر کاربرد را نصب می کنیم. قصت داریم در این مقاله نحوه نصب کلی این افزونه هارا آموزش دهیمتا برای سایت های جدیدی که قرار است راه اندازی کنیم از همین بسته استفاده کنیم.<br>ادامه مطلب...
   </div>
   
   <div class="lpanel-btn">
	<img id="bx1" src="http://progforum.ir/images/right-btn1.png" width="29" height="29">
	<img id="bx4" src="http://progforum.ir/images/left-btn1.png" width="29" height="29"> 
	</div>
    
</div>

[/INDENT][/LEFT]

ممنون میشم مشکلم رو حل کنید.

slider.png
 

حضرت css

کاربر تازه وارد
تازه وارد
پاسخ : مشکل در ایجاد اسلایدر

ساختار و منطق کد هایتون کاملا اشتباهه
برای ساخت این مدل اسلایدر ها position هر باکس رو absolute بذارید و در jquery به ازای هرکلیک میگید که همه باکس ها هاید بشن الان اونی که اکتیو هست
 
بالا