Forgot Password ??

PHP , ASP , ASP.NET, VB.NET, C#, Java , jQuery , Android , iOS , Windows Phone

	Registered : 109,037

HOME > PHP > PHP Forum > php กับ jQuery ทำยังไงให้ Tab เลื่อนไปด้านข้างเองอัตโนมัติครับ

php กับ jQuery ทำยังไงให้ Tab เลื่อนไปด้านข้างเองอัตโนมัติครับ

เริ่มหัวข้อใหม่

mmc01

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

ผมใช้ jquery สร้าง Tab ขึ้นมาแสดงข่าว แล้วต้องการทำให้มันเลื่อนไปทางขวาเอง ให้เลื่อนไปเรื่อยๆอัตโนมัติเหมือน Tab ข่าวของเว็บ sanook.com ที่พอรอสักพัก Tab มันจะเลื่อนไปทางขวาเอง พอเลื่อนไปครั้งนึงก็หยุดรออยู่พักนึงแล้วเลื่อนต่อไปอีกแบบนี้เรื่อยๆโดยเราไม่ต้องคลิกอะไรเลย ทำยังไงครับ

ผมสร้าง Tab ด้วย jquery แบบนี้ครับ
Code

<table id="news" width="100%" border="0">
<tr>
<td>
<h2 class="demoHeaders">ข่าว</h2>
<div id="tabs" >
<ul>
<li><a href="#tabs-1">ข่าว</a></li>
<li><a href="#tabs-2">บันเทิง</a></li>
<li><a href="#tabs-3">ท่องเที่ยว</a></li>
<li><a href="#tabs-4">กีฬา</a></li>
<li><a href="#tabs-5">เกมส์</a></li>
</ul>
<div id="tabs-1"></div>
<div id="tabs-2"></div>
<div id="tabs-3"></div>
<div id="tabs-4"></div>
<div id="tabs-5"></div>
</div></td>
</tr>
</table>

แล้วเรียก XML ให้แสดงบน Tab แบบนี้
Code (JavaScript)

<script type="text/javascript">

$(function(){
// Tabs
$("#tabs").tabs({event: 'mouseover'});

loadNews();
loadEntertain();
loadTour();
loadSport();
loadGame();

Tag : PHP, jQuery

Date : 2010-08-20 01:50:01

By : mmc01

View : 3107

Reply : 2

No. 1

Guest

thank you

Date : 2010-11-01 23:47:11

By : service

No. 2

Guest

เปลี่ยนจาก $("#tabs").tabs({event: 'mouseover'});
เป็นอีกอันนึงนะคะ
Code (PHP)

$("#tabs").tabs().tabs("rotate",5000,true); 
// กำหนดแบบ ให้เลื่อน tab อัตโนมัติตามเวลาที่กำหนด 
// 1000 เท่ากับ 1 วินาที ตัวอย่างกำหนด 5000 เลื่อนทุกๆ 5 วินาที 
// true คือเมื่อเลื่อนจนถึงลำดับสุดท้าย ให้วนกลับมาเริ่มต้นใหม่
// fกำหนดเป็น false ถ้าต้องการให้ทำการเลื่อนอัตโนมัติแค่ครั้งเดียว

Date : 2010-12-07 12:40:45

By : lainhua

ค้นหาข้อมูล

แสดงความคิดเห็น

Re : php กับ jQuery ทำยังไงให้ Tab เลื่อนไปด้านข้างเองอัตโนมัติครับ

รายละเอียด

เพื่อความเรียบร้อยของข้อความ ควรจัดรูปแบบให้พอดีกับขนาดของหน้าจอ เพื่อง่ายต่อการอ่านและสบายตา และตรวจสอบภาษาไทยให้ถูกต้อง

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

Notice

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

เพื่อความปลอดภัยและการตรวจสอบ กระทู้ที่แทรกไฟล์อัพโหลดไฟล์จากที่อื่น อาจจะถูกลบทิ้ง

โดย

อีเมล์

บวกค่าให้ถูก

<= ตัวเลขฮินดูอารบิก เช่น 123 (หรือล็อกอินเข้าระบบสมาชิกเพื่อไม่ต้องกรอก)

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

Load balance : Server 05