Register Register Member Login Member Login Member Login Forgot Password ??
PHP , ASP , ASP.NET, VB.NET, C#, Java , jQuery , Android , iOS , Windows Phone
 

Registered : 109,027

HOME > PHP > PHP Forum > อยากทราบเกี่ยวกับการเขียน code สร้างแถบเมนูครับ ขอบพระคุณมากครับ



 

อยากทราบเกี่ยวกับการเขียน code สร้างแถบเมนูครับ ขอบพระคุณมากครับ

 



Topic : 070939



โพสกระทู้ ( 31 )
บทความ ( 0 )



สถานะออฟไลน์




ผมอยากให้พี่ๆช่วยผมหน่อยนะครับ


คือว่าผมมีแถบเมนูอันนึง

1

เมื่อผมทำการคลิกที่เมนู แบบฝึกหัดที่ 1 ปุ๊ป

มันจะโชว์เมนูย่อยของ แบบฝึกหัดที่ 1 ออกมาให้เลือก

2

ผมอยากทราบว่าผมจะต้องเขียนcodeอย่างไรครับ

ช่วยยกตัวอย่างcodeให้ทีนะครับ

ขอบพระคุณมากครับ



Tag : PHP







Move To Hilight (Stock) 
Send To Friend.Bookmark.
Date : 2011-12-25 23:15:02 By : Herkaus View : 10059 Reply : 17
 

 

No. 1

Guest


ลองเข้าไปดูตัวอย่างในนี้นะ มีเยอะ
http://www.webdesigndev.com/web-development/create-the-fanciest-dropdown-menu-you-ever-saw






แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2011-12-25 23:25:23 By : บังเอิญผ่านมาเห็น
 


 

No. 2



โพสกระทู้ ( 1 )
บทความ ( 0 )



สถานะออฟไลน์


จัดไป....

http://www.upload-thai.com/download.php?id=7d27b9a8d1adc9f595f3bc25cbcb0108


ประวัติการแก้ไข
2011-12-25 23:31:15
2011-12-25 23:33:02
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2011-12-25 23:28:18 By : emetal
 

 

No. 3



โพสกระทู้ ( 708 )
บทความ ( 0 )



สถานะออฟไลน์
Facebook

ตัวอย่างง่ายๆครับ
Code
<html>
<head>
<title>Menu Sample</title>
<style>
.submenu{
display:none
}
</style>
<script type="text/javascript" src="jquery-1.6.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('.menu li').click(function(){
var index=$(this).index();
$('.menu li:eq('+index+') .submenu').slideToggle(200);
});
});
</script>
</head>
<body>
<ul class="menu">
<li>
<a href="#">Menu 1</a>
<ul class="submenu">
<li><a href="#">Submenu 1</a></li>
<li><a href="#">Submenu 2</a></li>
<li><a href="#">Submenu 3</a></li>
</ul>
</li>
<li>
<a href="#">Menu 2</a>
</li>
<li>
<a href="#">Menu 3</a>
</li>
</ul>
</body>
</html>

แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2011-12-25 23:44:30 By : kerb
 


 

No. 4



โพสกระทู้ ( 11,835 )
บทความ ( 10 )

สมาชิกที่ใส่เสื้อไทยครีเอท Hall of Fame 2012

สถานะออฟไลน์


หา plugin มาใช้ก็ได้ครับเยอะแยะ jquery accordion menu หาดูครับ
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2011-12-25 23:46:56 By : ikikkok
 


 

No. 5



โพสกระทู้ ( 31 )
บทความ ( 0 )



สถานะออฟไลน์


ขอบพระคุณพี่ๆทุกคนมากครับ ที่ช่วยแนะนำ Code
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2011-12-25 23:50:10 By : Herkaus
 


 

No. 6



โพสกระทู้ ( 31 )
บทความ ( 0 )



สถานะออฟไลน์


เอ่อพี่ๆครับ ผมขอรับกวนอีกสักนิดนะครับ ผมมีเรื่องสงสัยดังนี้ครับ

ผมมีหน้าเวปอยู่อันนึง

123

พอคลิ๊กที่คำว่า LAN Design ก็จะโชว์ภาพขึ้นมาแบบนี้นะครับ

321


จะต้องเขียนcodeอย่างไรดีครับ มันคนละอย่างกับการใช้ submenu ใช่ใหมครับ
รับกวนด้วยนะครับ ขอบพระคุณพี่ๆมากครับที่ช่วยตอบคำถาม
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2011-12-26 01:03:39 By : Herkaus
 


 

No. 7



โพสกระทู้ ( 708 )
บทความ ( 0 )



สถานะออฟไลน์
Facebook

มันคล้ายๆกันแหละครับ ซ่อนไว้ก่อน พอคลิกค่อยโชว์

Code (PHP)
<html>
<head>
<title>Menu Sample</title>
<style>
#content{
display:none
}
</style>
<script type="text/javascript" src="jquery-1.6.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('#link').click(function(){
$('#content').slideToggle(200);
});
});
</script>
</head>
<body>

<a id="link" href="#">LAN Design</a>
<div id="content">
      <img src="https://www.thaicreate.com/upload/stock/20111226010117.png">
</div>
</body>
</html>

แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2011-12-26 03:29:30 By : kerb
 


 

No. 8



โพสกระทู้ ( 31 )
บทความ ( 0 )



สถานะออฟไลน์


ขอบพระคุณมากครับพี่ ผมจะเอาไปศึกษาดูครับ
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2011-12-27 13:34:15 By : Herkaus
 


 

No. 9



โพสกระทู้ ( 31 )
บทความ ( 0 )



สถานะออฟไลน์


ตอบความคิดเห็นที่ : 7 เขียนโดย : kerb เมื่อวันที่ 2011-12-26 03:29:30
รายละเอียดของการตอบ ::
พี่ครับ ผมเกิดความสงสัยใน code บรรทัดที่ 12 ที่เขียนว่า

$('#link').click(function(){

ผมอยากทราบว่าบรรทัดนี้มันทำงานอย่างไรครับ

แล้วตัวแปร $('#link') มันใช้ทำอะไรหรอครับ

ขอบพระคุณมากครับพี่



ประวัติการแก้ไข
2011-12-27 21:38:34
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2011-12-27 21:37:20 By : Herkaus
 


 

No. 10



โพสกระทู้ ( 455 )
บทความ ( 0 )



สถานะออฟไลน์


$('#link').click(function(){

#link คือ

<a id="link" href="#">LAN Design</a>

ที่เป็นสีแดงครับ


$('#link').click(function(){ ----คือ...เมื่อคลิ๊ก----> <a id="link" href="#">LAN Design</a>
แล้วตามด้วยคำสั่งนี้ $('#content').slideToggle(200);
ก็จะโชว์ ใสส่วนของไอดีนี้
<div id="content">
<img src="https://www.thaicreate.com/upload/stock/20111226010117.png">
</div>


ประวัติการแก้ไข
2011-12-28 08:27:21
2011-12-28 08:30:57
2011-12-28 08:31:41
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2011-12-28 02:57:13 By : yamcrocodile
 


 

No. 11



โพสกระทู้ ( 80 )
บทความ ( 0 )



สถานะออฟไลน์
Facebook

ถามนิดนึงครับ เว็บที่ผมทำหน้าหลักอะครับ มันส่งตัวแปร http://localhost/index.php?viewpage=''
แต่พอเอาโค๊ดนี้มาใส่มันก็ส่งค่ามาแบบนี้อะครับ http://localhost/index.php?viewpage=''#
มันไม่สามารถสไลด์ลงมาได้อะครับ
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2011-12-28 11:31:08 By : DonutJung
 


 

No. 12



โพสกระทู้ ( 708 )
บทความ ( 0 )



สถานะออฟไลน์
Facebook

โหลด jquery-1.6.2.min.js มาไว้ในเครื่องรึยังครับ
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2011-12-28 12:33:58 By : kerb
 


 

No. 13



โพสกระทู้ ( 455 )
บทความ ( 0 )



สถานะออฟไลน์


ตามนั้นหาโหลด ได้ที่...http://jquery.com/
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2011-12-28 13:20:16 By : yamcrocodile
 


 

No. 14



โพสกระทู้ ( 80 )
บทความ ( 0 )



สถานะออฟไลน์
Facebook

โหลดมาแล้วครับพี่ ถ้ารันเลยที่ยังไม่ได้เข้าไปทำอะไรจะเป็นแบบนี้อะครับ http://localhost/jquery%20tree%20menu%20css%20slide-up-down/test.html
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2011-12-28 14:03:46 By : DonutJung
 


 

No. 15



โพสกระทู้ ( 31 )
บทความ ( 0 )



สถานะออฟไลน์


ผมรบกวนพี่ๆขอแทรกคำถามข้อสงสัยใหม่อีกนิดนึงนะครับ
ผมอยากทำให้หน้าเวปของผมให้มีลักษณะพิเศษเพิ่มขึ้นมาอีกนิดนึงนะครับ ผมขออธิบายดังรูปต่อไปนี้ครับ

รูปที่1 ก่อนทำการกดปุ่มแสดงรูปภาพ
555555


รูปที่2 หลังจากทำการกดปุ่มแสดงรูปภาพ
555555555+


รูปที่3 หลังจากทำการกดปุ่มซ่อนรูปภาพ
555555555555555555++++++++++


มันต้องใช้การเขียน Code อย่างไร
ผมขอรบกวนเวลาพี่ๆ ช่วยแนะนำ Code ด้วยนะครับ
ขอบพระคุณพี่ๆมากครับ
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2011-12-29 06:10:20 By : Herkaus
 


 

No. 16



โพสกระทู้ ( 708 )
บทความ ( 0 )



สถานะออฟไลน์
Facebook

Code (PHP)
<title>Menu Sample</title>
<style>
#content{
display:none
}
</style>
<script type="text/javascript" src="jquery-1.6.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('#menu1 #link').click(function(e){
        e.preventDefault();
        $('#menu1 #content').slideToggle(200);
        $('#menu1 img.arrow').toggle();
});
});
</script>
</head>
<body>

<div id="menu1">
	<img class="arrow" width="16px" height="16px" src="http://www.designofsignage.com/images/arrow_down_wb1.jpg">
	<img class="arrow" width="16px" height="16px" src="http://www.designofsignage.com/images/arrow_up_wb1.jpg" style="display:none">
	<a id="link" href="#">LAN Design</a>
	<div id="content">
      <img src="https://www.thaicreate.com/upload/stock/20111226010117.png">
	</div>
</div>
</body>
</html>


แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2011-12-29 11:35:51 By : kerb
 


 

No. 17



โพสกระทู้ ( 31 )
บทความ ( 0 )



สถานะออฟไลน์


ผมลองนำ code พี่ไปประยุกต์ใช้ดูแล้ว ใช้งานได้ดีเลยครับ

ขอบพระคุณพี่มากๆครับที่ช่วยยกตัวอย่าง code ให้
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2011-12-29 21:05:50 By : Herkaus
 

   

ค้นหาข้อมูล


   
 

แสดงความคิดเห็น
Re : อยากทราบเกี่ยวกับการเขียน code สร้างแถบเมนูครับ ขอบพระคุณมากครับ
 
 
รายละเอียด
 
ตัวหนา ตัวเอียง ตัวขีดเส้นใต้ ตัวมีขีดกลาง| ตัวเรืองแสง ตัวมีเงา ตัวอักษรวิ่ง| จัดย่อหน้าอิสระ จัดย่อหน้าชิดซ้าย จัดย่อหน้ากึ่งกลาง จัดย่อหน้าชิดขวา| เส้นขวาง| ขนาดตัวอักษร แบบตัวอักษร
ใส่แฟลช ใส่รูป ใส่ไฮเปอร์ลิ้งค์ ใส่อีเมล์ ใส่ลิ้งค์ FTP| ใส่แถวของตาราง ใส่คอลัมน์ตาราง| ตัวยก ตัวห้อย ตัวพิมพ์ดีด| ใส่โค้ด ใส่การอ้างถึงคำพูด| ใส่ลีสต์
smiley for :lol: smiley for :ken: smiley for :D smiley for :) smiley for ;) smiley for :eek: smiley for :geek: smiley for :roll: smiley for :erm: smiley for :cool: smiley for :blank: smiley for :idea: smiley for :ehh: smiley for :aargh: smiley for :evil:
Insert PHP Code
Insert ASP Code
Insert VB.NET Code Insert C#.NET Code Insert JavaScript Code Insert C#.NET Code
Insert Java Code
Insert Android Code
Insert Objective-C Code
Insert XML Code
Insert SQL Code
Insert Code
เพื่อความเรียบร้อยของข้อความ ควรจัดรูปแบบให้พอดีกับขนาดของหน้าจอ เพื่อง่ายต่อการอ่านและสบายตา และตรวจสอบภาษาไทยให้ถูกต้อง

อัพโหลดแทรกรูปภาพ

Notice

เพื่อความปลอดภัยของเว็บบอร์ด ไม่อนุญาติให้แทรก แท็ก [img]....[/img] โดยการอัพโหลดไฟล์รูปจากที่อื่น เช่นเว็บไซต์ ฟรีอัพโหลดต่าง ๆ
อัพโหลดแทรกรูปภาพ ให้ใช้บริการอัพโหลดไฟล์ของไทยครีเอท และตัดรูปภาพให้พอดีกับสกรีน เพื่อความโหลดเร็วและไฟล์ไม่ถูกลบทิ้ง

   
  เพื่อความปลอดภัยและการตรวจสอบ กระทู้ที่แทรกไฟล์อัพโหลดไฟล์จากที่อื่น อาจจะถูกลบทิ้ง
 
โดย
อีเมล์
บวกค่าให้ถูก
<= ตัวเลขฮินดูอารบิก เช่น 123 (หรือล็อกอินเข้าระบบสมาชิกเพื่อไม่ต้องกรอก)







Exchange: นำเข้าสินค้าจากจีน, Taobao, เฟอร์นิเจอร์, ของพรีเมี่ยม, ร่ม, ปากกา, power bank, แฟลชไดร์ฟ, กระบอกน้ำ

Load balance : Server 04
ThaiCreate.Com Logo
© www.ThaiCreate.Com. 2003-2024 All Rights Reserved.
ไทยครีเอทบริการ จัดทำดูแลแก้ไข Web Application ทุกรูปแบบ (PHP, .Net Application, VB.Net, C#)
[Conditions Privacy Statement] ติดต่อโฆษณา 081-987-6107 อัตราราคา คลิกที่นี่