-`๏'- Friends' blogs & Links (Jump Menu) Friends' blogs & Links (Jump Menu) 'Jump Menu' นี้ แตกต่างจาก 'Jump Menu' ที่ผ่านมา อยู่สามส่วนคือ หนึ่ง ในด้านการแสดงผล จะเป็นการสร้าง Blog ใหม่ขึ้น เมื่อเลือกข้อมูล (Click) สอง รูปลักษณะ จะมีปุ่มกด (button) เป็นส่วน input ข้อมูล สาม โค้ดมีเพียงส่วนเดียว ส่วนของโค้ดทั้งหมด สามารถเก็บไว้ที่ส่วนใดๆ ของพื้นที่ Blog ก็ได้ที่ต้องการ ตัวอย่างที่นำมาเสนอนี้ได้เก็บไว้ที่ส่วนของ Profile • โค้ด • <form name=aaaa> <select name=bbbb style="FONT-SIZE: 8pt; font:Arial; BACKGROUND:#FEFF99; WIDTH:208; COLOR:#2F4F4F; border:0; AutoSize:false;"> <option>►►►►►► ไปให้ไกลๆ เลยไป ◄◄◄◄◄◄</option> <option value="//www.yahoo.com/">Yahoo!</option> <option value="//www.msn.com/">MSN</option> <option value="//www.google.co.th/">Google</option> <option value="//www.pantip.com/">Pantip</option> </select>&nbsp;<input type=button onclick='if (document.aaaa.bbbb.value) { window. open(document.aaaa.bbbb.value); }' name=popitup value='Go!' style='FONT-SIZE: 8pt; BACKGROUND:#FEFF99;COLOR:#2F4F4F'> </form> ***เรื่องสำคัญมาก *** ในการนำไปใช้งานให้ท่านขยับข้อความ window. open ให้ชิดกันก่อนนำไปใช้ รายละเอียดของโค้ด • <form name=aaaa> กำหนดชื่อ form มีผลต่อการเรียกใช้คำสั่ง (ชื่อไม่ควรซ้ำกับส่วน select name) • <select name=bbbb กำหนดชื่อ select มีผลต่อการเรียกใช้คำสั่ง (ชื่อไม่ควรซ้ำกับส่วน form name) ขออธิบายความสัมพันธ์ของสองส่วนข้างต้นเสียก่อน ดูจากภาพ จะเห็นว่าชื่อที่เรากำหนดลงไปมีผลต่อการเรียกใช้คำสั่ง ดังนั้นการตั้งชื่อตรงส่วนนี้ควรหลีกเลี่ยงการใช้อักขระพิเศษหรือรูปแบบที่ไม่ปกติทั่วไป (รวมทั้งไม่ควรมีช่องไฟในระหว่างอักษร) • ส่วนของคุณลักษณะทั่วไป (style) 'Jump Menu' ไม่ได้แตกต่างแต่อย่างใดกับ 'Menu(มาน)กระโดด' ที่เคยนำเสนอไปก่อนหน้านี้ จึงขอละไว้ที่จะไม่อธิบายซ้ำ ถ้าท่านเพิ่งได้เข้ามาชมที่เนื้อหานี้เป็นครั้งแรกและมีความสงสัยใคร่รู้เกี่ยวกับวิธีกำหนดคุณลักษณะทั่วไป (style) ของ 'Jump Menu' รบกวนเชิญ ทางนี้ เลยจ้า • <option>►►►►►► ไปให้ไกลๆ เลยไป ◄◄◄◄◄◄</option>    <option value="//www.yahoo.com/">Yahoo!</option> ข้อมูลส่วนนี้มีลักษณะคล้ายกับ 'Menu(มาน)กระโดด' จึงขอละเว้นไว้ที่จะอธิบายเช่นเดียวกัน • <input type=button onclick='if (document.aaaa.bbbb.value) { window(document.aaaa.bbbb.value); }' name=popitup value='Go!' style='FONT-SIZE: 8pt; BACKGROUND:#FEFF99;COLOR:#2F4F4F'> เป็นส่วน input ข้อมูล เราสามารถกำหนดคุณลักษณะ (style) ของปุ่มกด (button)ได้เช่นเดียวกัน : รูปแบบการนำไปใช้ : ►►►►►► ไปให้ไกลๆ เลยไป ◄◄◄◄◄◄ Yahoo! MSN Google Pantip    ใส่ค่า border:1; ในส่วน style ของ select ►►►►►► ไปให้ไกลกว่านี้อีก..ดิ ◄◄◄◄◄◄ Yahoo! MSN Google Pantip  ใส่<p align=center>..ครอบส่วน input..</p> ►►►►►► ไปดาวอังคารเลยดีก่า ◄◄◄◄◄◄ Yahoo! MSN Google Pantip  ใส่ค่า WIDTH:208; ลงในส่วน style ของ input : การประยุกต์ใช้กับ Friends Link : เราสามารถนำ 'Jump Menu' ไปใช้ทำMenu Friends Link แทนที่ของเดิมที่ทาง Bloggang มีให้ได้เช่นเดียวกันกับ Jump Menu ลักษณะเดียวกัน แต่สิ่งที่อยากฝากไว้เป็นข้อสังเกตุก็คือ วิธีการอ้างอิง Link ที่ถูกต้องมีดังนี้ <option value=' //www.bloggang.com/mainblog.php?id=saveme //saveme.bloggang.com/ '>Dying To Be Alive</option> ➠ mainblog ➠ อ้างอิง 'หน้าหลัก' ของเจ้าของบล๊อก ➠ saveme ➠ อ้างอิง 'id' ของเจ้าของบล๊อกที่เราทำการแอดฯ <option value='//www.bloggang.com/mainblog.php?id=petit-patty'>Petit Patty</option> <option value='//www.bloggang.com/mainblog.php?id=happyday'>นู๋ส้มจุก</option> สังเกตุจากตรงนี้ก็จะเห็นว่าตัวแปร Friends Link ก็คือชื่อ 'id' ของผู้ที่เราต้องการแอดฯ นั่นเอง ➠ ส่วนของ Log In คือชื่อที่ใช้ในการลงทะเบียน เช่น -`๏'- MeIKha เป็นต้น หมายเหตุ.- ตัวอย่างที่แสดงข้างบนเป็นเพียงให้ดูรูปแบบเท่านั้น ไม่ได้เซตให้ใช้งานได้จริง หากต้องการทดสอบประสิทธิภาพที่แท้จริง ให้ทดสอบที่ Menu ด้านข้างขวา Song : Dragostea Din Tei [Eurobeat Remix] Artist : O-Zone   Create Date : 03 ธันวาคม 2548 8 comments Last Update : 7 มกราคม 2549 21:16:31 น. Counter : 1404 Pageviews. Share Tweet

เข้ามาBlog น้องไหมทีไร ไม่เคยผิดหวังเลยน๊ะ เก่งจริง ๆ ต้องลองอ่าน และก็ตอ้งลองดู พี่ตุ๊กตา โหวตให้เลยจ๊า......   โดย: tukata001 4 ธันวาคม 2548 9:54:53 น.

หน้าแรกยังทำไม่เป็นเลยอะ กระโดดมาเรียนหน้านี้อก่องนะ เจ้าไดโนซอ ถ้าทามไม่เป็นจาจับตัวเจ้าไปเป็นตัวประกัน   โดย: อินทรีทองคำ 4 ธันวาคม 2548 11:55:56 น.

อู๊ย มีชื่อเราด้วย อู๊ย เขิลลลลลลลลลล   โดย: นู๋ส้มจุก 7 ธันวาคม 2548 14:46:37 น.

ขอบคุณค๊าไหม มาก๊อปโค้ดไปใช้ค่ะ จุ๊บๆๆ   โดย: yadegari 19 ธันวาคม 2548 17:14:07 น.

ทำแล้วคะไม กำลังจัดการเรื่อยๆๆค่ะ ขอบคุณค๊า   โดย: yadegari 20 ธันวาคม 2548 2:20:32 น.

ขอบคุณมากนะคะ   โดย: กระจ้อน 26 พฤษภาคม 2549 13:33:42 น.

จะรบกวนหน่อยค่ะ พอดีนำโค้ดนี้ไปใช้ค่ะ แต่ใช้ไม่ได้อ่ะค่ะ ไม่แน่ใจว่าผิดพลาดตรงไหน ก๊อปโค้ดด้านบนไปค่ะ ช่วยตอบด้วยนะคะ ขอบคุณค่ะ   โดย: JJ&TheGang 4 เมษายน 2552 17:08:06 น.

ขอบคุณครับ ได้อะไรเยอะจริงๆ ถ้าไม่ได้คุณผมแย่แน่ๆๆ ดูตัวอย่างได้นะครับ thaibaki.blogspot   โดย: เจ๋งดีครับ IP: 117.47.32.55 25 ตุลาคม 2552 0:42:02 น.