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 > ติดปัญหาการแทรก jQuery/ JavaScript ตอนทำ Menu Bar ครับเกี่ยวกับการ Hover เม้าที่เมนูครับ



 

ติดปัญหาการแทรก jQuery/ JavaScript ตอนทำ Menu Bar ครับเกี่ยวกับการ Hover เม้าที่เมนูครับ

 



Topic : 089829



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



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




อันนี้คือส่วนของCssนะครับ

#menu,#menu ul
{
margin:0;
padding:0;
position:relative;
line-height:1.5em;
}
#menu a
{
color:#FFF;
background-color:#333;
border:1px solid #444;
display:block;
text-decoration:none;
text-align:center;
width:125px;
}
#menu a:hover
{
color:#000;
background-color:#FFF;
}
#menu li
{
position:relative;
float:left;
list-style:none;
}
#menu ul
{
 position:absolute;
width:150px;
top:25px;
display:none;
}
#menu li ul a
{
width:150px;
float:left;
}
#menu ul ul
{
top:auto;
}
#menu li ul ul
{
left:150px;
}
อันนี้คือส่วนที่แทรกJs/Jq
<script src="jquery-1.9.0.js"></script>
<script>
$('#menu li').hover(function(){
	$('ul:first',this).css({visibility:"visible"}).fadeln(600).show();
	
},function(){
	$('ul:first',this).css({visibility:"hidden"});
	
});
</script>

คือต้องการให้ตอนเอาเม้าไปoverมันจะมีลิ้งMenuออกมาด้านหลังแต่มันไม่มีครับ ไม่ทราบผมต้องแก้ไขตรงไหนบ้างคิดว่าน่าจะเป็นในตัวของscriptนะครับรบกวนทีครับ ขอบคุณมากๆ



Tag : PHP, JAVA







Move To Hilight (Stock) 
Send To Friend.Bookmark.
Date : 2013-01-26 16:03:01 By : bearcookies View : 1986 Reply : 16
 

 

No. 1



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



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


รบกวนช่วยทีครับT_T






แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2013-01-26 16:08:17 By : bearcookies
 


 

No. 2



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



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


ไม่มีใครตอบเลย Y_Y
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2013-01-26 16:24:14 By : bearcookies
 

 

No. 3



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



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


'หนึ่งภาพแทนพันคำ'
ลอง capture ภาพมาให้ดูหน่อยครับ นึกไม่ออกว่าสิ่งที่ต้องการเป็นอย่่างไร
เอาโค้ด Html ส่วนของเมนูมาโพสด้วยครับ ต้องเห็นส่วนนี้ก่อนถึงจะแก้ไขให้ได้

version นี้ออกแล้วหรือครับ 'jquery-1.9.0.js'
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2013-01-26 16:31:42 By : dreamlover
 


 

No. 4



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



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


http://code.jquery.com/jquery.min.js โหลดมาจากเว็บไซด์หลักมันอ่ะครับหรือมันยังไม่ใช่ตัวเต็มหรือผมพลาดไปผมพึ่งหัดทำ jQ วันนี้วันแรกเลยครับ
สิ่งที่ผมต้องการให้เป็นเป็นลักษณะแบบนี้ครับ
Menu1 Menu2 Menu3
พอเราเอาเม้าชี้ที่ Menu2 ก็จะListลงออกมาแบบนี้นะครับ
Menu1 Menu2 Menu3
submenu2-1
submenu2-2


แล้วพอชี้ที่Submenu2-1ก็แยกออกไปด้านข้างเป็นลักษณะประมาณนี้ครับ
Menu1 Menu2 Menu3
submenu2-1>submenu2-1-1
>submenu2-1-2
ขอโทษที่ไม่มีภาพครับเพราะผมยังทำไม่ได้เลยเป็นแค่นโนภาพที่ต้องการอยากให้เป็นครับอันนี้คือในส่วนของbodyครับ

Code (PHP)
<body>
<ul id="menu">
<li><a href="#">Menu1</a></li>
<li><a href="#">Menu2</a>
<ul>
<li><a href="#">submenu2-1</a>
<ul>
<li><a href="#">submenu2-1-1</a></li>
<li><a href="#">submenu2-1-2</a></li>
</ul>
</li>
<li><a href="#">submenu2-2</a>
<ul>
<li><a href="#">submenu2-2-1</a></li>
<li><a href="#">submenu2-2-2l</a></li>
</ul>
</li>
</ul>
</li>
<li><a href="#">Menu3</a></li>
</ul>
</body>

ชี้แนะด้วยครับขอบคุณมากครับ
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2013-01-26 16:41:42 By : bearcookies
 


 

No. 5



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



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


อันนี้Linkที่โหลดครับผมโหลดอันแรกเลยครับhttp://jquery.com/download/
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2013-01-26 16:44:51 By : bearcookies
 


 

No. 6



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



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


'ทำ jQ วันนี้วันแรกเลยครับ' ให้เขียนว่า jQuery นะครับเพราะว่าคำนี้ก็เป็นคำย่ออยู่แล้ว

'menu' เป็นสิ่งที่ยากอันดับต้นๆในบรรดาการเขียนโค้ด front-end ถ้าเพิ่งเริ่มหัด แนะำนำให้ไปลองศึกษาอย่างอื่นดูก่อน แต่จะลองเอาโค้ดไปศึกษาก่อนก็ได้ครับ ผมเคยทำให้สมาชิกไว้ แต่จะเป็นเมนูคนละแบบ ไปดาวโหลดมาดูได้

http://www.mineinc.net/qa/file/2012/12/07/file1.html
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2013-01-26 17:01:21 By : dreamlover
 


 

No. 7



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



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


คุณJackครับผมบังเอิญไปเจอเว็บนี้มา
http://bugs.jquery.com/ticket/13328
เขาบอก 1.9.0 ใช้กับ Ie8 ไม่ได้เหรอครับ
ขอบคุณสำหรับcodeนะครับ
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2013-01-26 17:19:02 By : bearcookies
 


 

No. 8



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



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


ลืมบอกไปว่าเมนูแบบที่คุณต้องการเรียกว่า drop-down menu

ผมเิ่พิ่งรู้ว่ามีเวอชั่นนี้จากโค้ดของคุณนี่แหละครับ ยังไม่ได้ศึกษาอะไรเลย
เท่าที่ผมลองมาเวอชั่นที่ผมให้ไป 1.7.2 จะเสถียรที่สุด ผมเคยใช้บางเวอร์ชั่นทำให้พวก plug-in ไม่รันไปเลยก็มี
อย่าำกังวลมากครับ พยายามให้ความสำคัญกับเรื่องพื้นฐาน เรื่องทฤษฎี หาตัวอย่างง่ายๆมาทำดู สนใจเรื่องพวกนี้จะดีกว่า
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2013-01-26 17:32:52 By : dreamlover
 


 

No. 9



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



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


คุณJackครับไม่ได้จริงๆ

Code (PHP)
<script src="http://code.jquery.com/jquery-1.7.2.min.js" type="text/javascript"></script>
<script type="text/javascript">
$('#menu li').hover(function(){
	$('ul:first',this).css({visibility:"visible",display:"none"}).fadeln(600).show();
},function(){
	$('ul:first',this).css({visibility:"hidden"});
});
แบบนี้เมนูก็ไม่ดรอปดาว
<script src="jquery-1.7.2.min.js"></script>
<script>
$('#menu li').hover(function(){
	$('ul:first',this).css({visibility:"visible",display:"none"}).fadeln(600).show();
},function(){
	$('ul:first',this).css({visibility:"hidden"});
});
</script>


ก็ไม่ดรอปดาวอีกอันแรกผมใช้วิธีก๊อบurl Codeมาเลยมันเป็นเพราะอะไรเหรอครับพอจะทราบไหม
ทั้ง2วิธีไม่ดรอปดาวทั้งคู่เลยคุณแจ๊ค
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2013-01-26 17:37:43 By : bearcookies
 


 

No. 10



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



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


เอ่อคุณแจ๊คครับผมขอถามอีกอย่างกรณีที่ผมอ้างที่อยู่เจคิวรี่โดยURL CODEมันไม่ขึ้น syntax errorแต่พออ้างจากไฟล์เจคิวรี่ที่โหลดมามันขึ้นแบบนี้อะครับ
1/2 There is a syntax error on line 3 of jquery 1.7.2 min.js. Code hinting may not work until you fix this error
แบบนี้คือเหรอครับคุณแจ๊ค
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2013-01-26 17:40:22 By : bearcookies
 


 

No. 11



โพสกระทู้ ( 4,169 )
บทความ ( 7 )

Hall of Fame 2012

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


ตามความเห็นนะครับ ผมว่า ในกการกำหนด style เราสามารถแทรก class เข้าไปที่ tab menu ได้เลยไม่จำเป็นต้องเขียน code เข้าไปใน script jquery ในส่วนของ script jquery เรานำมาแสดงเกี่ยวกับ effect ต่างๆดีกว่าครับ


หมายเหตุ บางทีมันอาจจะเป็น เพราะ fadeIn().show(); ก็ได้เท่าที่สั่งเกตุ fadeIn คือแสดงผลอยู่แล้ว ไม่จำเป็นต้อง show() ก็ได้มั้งครับ ("อันนี้แล้วแต่นะครับ")
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2013-01-26 17:43:34 By : Ex-[S]i[L]e[N]t
 


 

No. 12



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



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


คุณแก้ไขเป็นยังไงดีครับคุณEx-[S]i[L]e[N]t
แล้วแจ้งเตือนแบบนี้มันคืออะไรเหรอครับ1/2 There is a syntax error on line 3 of jquery 1.7.2 min.js. Code hinting may not work until you fix this error รบกวนด้วยครับ
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2013-01-26 17:48:47 By : bearcookies
 


 

No. 13



โพสกระทู้ ( 4,169 )
บทความ ( 7 )

Hall of Fame 2012

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


ลองทำทีละส่วนก่อนครับ ทดสอบก่อนว่าแสดงผลหรือไม่ ถ้าแสดง ค่อยแทรก function ต่างๆเข้าไป ทำทีละสเต๊ป ช้าๆไม่ต้องรีบ เอาชัวครับ
Code (PHP)
<script>
$('#menu li').hover(function(){
     $('ul:first').fadeln(600);
}
</script>



ประวัติการแก้ไข
2013-01-26 17:55:55
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2013-01-26 17:55:13 By : Ex-[S]i[L]e[N]t
 


 

No. 14



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



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


ทำตามที่คุณEx-[S]i[L]e[N]tบอกละครับปรากฎว่าไม่ลงเหมือนเดิมครับ
ผมทดลอง 3 บราซเซอร์ครับ ไออี/โคมไฟ/หมาเพลิง ไม่ได้เลยครับจนปัญญาแล้วแง่วY_Y
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2013-01-26 18:06:34 By : bearcookies
 


 

No. 15



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



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


ผมว่ามันต้องเป็นที่version IEแน่เลยเพราะผมใช้ Ie9 ตอนนี้กำลังโหลด Ie6 มาทดสอบอยู่ครับได้ผลอย่างไหร่จะรีบบอกครับ ขอบคุณทั้ง 2 ท่านมาก
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2013-01-26 18:09:31 By : bearcookies
 


 

No. 16



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



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


ไม่ได้ครับแต่ก็ขอบคุณทั้ง 2 ท่านที่พยายามช่วยเหลือขอบคุณมากครับ
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2013-01-26 18:28:44 By : bearcookies
 

   

ค้นหาข้อมูล


   
 

แสดงความคิดเห็น
Re : ติดปัญหาการแทรก jQuery/ JavaScript ตอนทำ Menu Bar ครับเกี่ยวกับการ Hover เม้าที่เมนูครับ
 
 
รายละเอียด
 
ตัวหนา ตัวเอียง ตัวขีดเส้นใต้ ตัวมีขีดกลาง| ตัวเรืองแสง ตัวมีเงา ตัวอักษรวิ่ง| จัดย่อหน้าอิสระ จัดย่อหน้าชิดซ้าย จัดย่อหน้ากึ่งกลาง จัดย่อหน้าชิดขวา| เส้นขวาง| ขนาดตัวอักษร แบบตัวอักษร
ใส่แฟลช ใส่รูป ใส่ไฮเปอร์ลิ้งค์ ใส่อีเมล์ ใส่ลิ้งค์ 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 อัตราราคา คลิกที่นี่