1. Rumah
  2. tata letak jQuery EasyUI - menambahkan tab AutoPlay (Tab)

Tutorial tata letak jQuery EasyUI - menambahkan tab AutoPlay (Tab) Terbaik Pada tahun 2024, Dalam tutorial ini Anda dapat mempelajari Ambil jQuery EasyUI contoh,

tata letak jQuery EasyUI - menambahkan tab AutoPlay (Tab)

Tutorial ini akan menunjukkan cara untuk membuat Tab autoplay. Komponen tab menampilkan panel tab pertama, kemudian menampilkan kedua, ketiga id. kita akan menulis beberapa kode untuk secara otomatis beralih panel tab, kemudian biarkan siklus.

Langkah 1: Buat Tabs 

	<Div id = "tt" class = "easyui-tab" style = "width: 330px; height: 270px;">
		<Div title = "Shirt1" style = "padding: 20px;">
			<Img src = "images / shirt1.gif">
		</ Div>
		<Div title = "Shirt2" style = "padding: 20px;">
			<Img src = "images / shirt2.gif">
		</ Div>
		<Div title = "Shirt3" style = "padding: 20px;">
			<Img src = "images / shirt3.gif">
		</ Div>
		<Div title = "Shirt4" style = "padding: 20px;">
			<Img src = "images / shirt4.gif">
		</ Div>
		<Div title = "Shirt5" style = "padding: 20px;">
			<Img src = "images / shirt5.gif">
		</ Div>
	</ Div>

Langkah 2: Tulis Kode Autoplay 

	var index = 0;
	var t = $ ( '# tt');
	var tab = t.tabs ( 'tab');
	setInterval (function () {
		t.tabs ( 'pilih', tab [index] .panel ( 'Pilihan') title.);
		Indeks ++;
		if (index> = tabs.length) {
			Indeks = 0;
		}
	}, 3000);

Seperti yang Anda lihat, kita sebut pendekatan 'tab' untuk mendapatkan semua panel tab, dan menggunakan fungsi 'setInterval' untuk beralih mereka.

Ambil jQuery EasyUI contoh

jeasyui-layout-tabs3.zip

Tutorial Panas

Hubungi kami

tata letak jQuery EasyUI - menambahkan tab AutoPlay (Tab)
10/30