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,037

HOME > PHP > PHP Forum > ใครมีตัวอย่าง Source code PHP แบ่งหน้า แล้ววางลิ้งไว้ได้ทั้งด้านบน-ล่าง บ้างคะ (มีรูป)



 

ใครมีตัวอย่าง Source code PHP แบ่งหน้า แล้ววางลิ้งไว้ได้ทั้งด้านบน-ล่าง บ้างคะ (มีรูป)

 



Topic : 078884



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



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






ตามภาพเลยค่ะ



Tag : PHP, HTML/CSS









ประวัติการแก้ไข
2012-05-24 14:02:56
Move To Hilight (Stock) 
Send To Friend.Bookmark.
Date : 2012-05-24 14:02:27 By : Avrill View : 4968 Reply : 25
 

 

No. 1



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

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

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


แบบนี้หรือป่าวครับ...
http://www.xarg.org/2011/09/jquery-pagination-revised/






แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2012-05-24 14:11:09 By : t-monroe
 


 

No. 2



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



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


ตอบความคิดเห็นที่ : 1 เขียนโดย : t-monroe เมื่อวันที่ 2012-05-24 14:11:09
รายละเอียดของการตอบ ::

แบบนี้ก็ใช่ค่ะ แต่ยังใช้ไม่เป็น พยามยามศึกษาอยู่ค่ะ แต่อยากได้แบบ class หรือ ฟังชั่น php มากกว่าค่ะ


แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2012-05-24 15:03:16 By : Avrill
 

 

No. 3



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



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


ลองทำตามแล้ว ไม่สำเร็จ ใครก็ได้ช่วยทีค่ะ ดูให้หน่อยว่าเราทำผิดตรงไหน


Quote:
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Untitled Document</title>
<link rel="stylesheet" href="pagstyle.css" type="text/css" />

<style type="text/css">

#main div.pagination a {
text-decoration: inherit;
color:inherit;
font-weight: inherit;
}

div.pagination {
text-align: left!important;
padding: 5px;
}

div.element {
display: none;
}

div.pagination span.current,
div.pagination span.disabled {
cursor: default
}

span.number, span.lapping {
font-weight: bold;
}



#scroll a.current {
background-color:#c33;
}

#scroll a {
display:block;
background-color: #33c;
width:15px;
height:15px;
margin:5px;
-webkit-border-radius: 15px;
-moz-border-radius: 15px;
border-radius: 15px;
cursor:pointer;
}

#scroll {
position:fixed;
right:30px;
top:150px;
}

#exX {
-webkit-transform: rotate(90deg);font-weight:bold;color:#44c;
-moz-transform: rotate(90deg); position:fixed;right:10px;top:280px;
}


#main table {
width: 500px;
}
#main table td {
width: 20%;

}
#main td > span {
width: 70px;
display: block;
float:left;
text-align: right;
}
#main table th {
background: #333;
color:#fff;
}
h5 {
margin:0;
font-size:13px;
}

#images {
position:relative;
height:470px;
}

#images img {
position:absolute;
left:0px;
background:#fff;
}

#imagepaging {
position:relative;height:15px;
}

#imagepaging span, #imagepaging a {
position:absolute;display:block;width:15px;height:15px;cursor:pointer;
background-color:#ccc
}

#imagepaging span#imageshadow {
top:-2px;
background:#333;width:19px;height:19px;cursor:default;
}


#formatlinks a {
background:#ddd;
padding:5px;
float:left;
margin:3px;
font-weight:normal;
text-transform: lowercase;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
cursor:pointer;
}

</style>
</head>

<body>

<div id="exX">Examples</div>

<h3 id="ex2">Using Paging with multiple paginators</h3>


<h4>Average temperature of some cities in June</h4>

<div class="pagination"></div>

<div id="content">

<div class="element">
<h5>Las Vegas</h5>
<p>37°C / 98.6°F</p>
</div>

<div class="element">
<h5>Cairo</h5>
<p>35°C / 95°F</p>
</div>

<div class="element">
<h5>Houston</h5>
<p>33°C / 91.4°F</p>
</div>

<div class="element">
<h5>Madrid</h5>
<p>31°C / 87.8°F</p>
</div>

<div class="element">
<h5>Athens</h5>
<p>30°C / 86°F</p>
</div>

<div class="element">
<h5>Lisbon</h5>
<p>27°C / 80.6°F</p>
</div>

<div class="element">
<h5>Rome</h5>
<p>27°C / 80.6°F</p>
</div>

<div class="element">
<h5>Moscow</h5>
<p>23°C / 73.4°F</p>
</div>

<div class="element">
<h5>Los Angeles</h5>
<p>22°C / 71.6°F</p>
</div>

<div class="element">
<h5>San Francisco</h5>
<p>22°C / 71.6°F</p>
</div>

<div class="element">
<h5>Lima</h5>
<p>19°C / 66.2°F</p>
</div>

<div class="element">
<h5>Sydney</h5>
<p>18°C / 64.4°F</p>
</div>

<div class="element">
<h5>Johannesburg</h5>
<p>17°C / 62.6°F</p>
</div>

<div class="element">
<h5>Buenos Aires</h5>
<p>16° / 60.8°F</p>
</div>

</div>

<div id="pagination"></div>

<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.2.min.js"></script>
<script type="text/javascript" src="jquery.paging.min.js"></script>
<script type="text/javascript" src="paging.demo.min.js"></script>
<script src="jquery.ba-hashchange.js"></script>


<script>

var prev = {start: 0, stop: 0},
cont = $('#content div.element');

$(".pagination").paging(cont.length, {
format: '[< ncnnn! >]',
perpage: 3,
lapping: 2,
page: null, // we await hashchange() event
onSelect: function (page) {

var data = this.slice;

cont.slice(prev[0], prev[1]).css('display', 'none');
cont.slice(data[0], data[1]).fadeIn("slow");

prev = data;

return true; // locate!
},
onFormat: formatCallback
});

$(window).hashchange(function() {

if (window.location.hash)
Paging.setPage(window.location.hash.substr(1));
else
Paging.setPage(1); // we dropped the initial page selection and need to run it manually
});

$(window).hashchange();
</script>
</body>
</html>

แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2012-05-25 10:47:52 By : Avrill
 


 

No. 4



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

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

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


https://www.thaicreate.com/php/forum/078810.html
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2012-05-25 11:26:13 By : sakuraei
 


 

No. 5



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

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

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


ที่เห็นมีหลายตัวอย่าง ถ้าข้อมูลเยอะๆ ก็ใช้ตัวที่มาจาก Query ซึ่งจะดีกว่าการนับ element แบบตัวนี้
Code (JavaScript)
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Untitled Document</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="jQuery-Paging/jquery.paging.min.js"></script>
<script type="text/javascript" src="jQuery-Paging/jquery.xcolor.min.js"></script>

<script>
var prev = {start: 0, stop: 0},
    cont = $('#content div.element');

$(".pagination").paging(cont.length, {
        format: '[< ncnnn! >]',
        perpage: 3,
        lapping: 0,
        page: null, // we await hashchange() event
        onSelect: function (page) {

                var data = this.slice;

                cont.slice(prev[0], prev[1]).css('display', 'none');
                cont.slice(data[0], data[1]).fadeIn("slow");

                prev = data;

                return true; // locate!
        },
        onFormat: formatCallback
});

$(window).hashchange(function() {

        if (window.location.hash)
                Paging.setPage(window.location.hash.substr(1));
        else
                Paging.setPage(1); // we dropped the initial page selection and need to run it manually
});

$(window).hashchange();
</script>
</head>
<body>
<div class="a">

	<div class="pagination toppagination"></div>

	<div id="content">

		<div style="color: rgb(255, 0, 0); display: block;" class="element">
			<h5>Las Vegas</h5>
			<p>37°C / 98.6°F</p>
		</div>

		<div style="color: rgb(236, 7, 18); display: block;" class="element">
			<h5>Cairo</h5>
			<p>35°C / 95°F</p>
		</div>

		<div style="color: rgb(218, 14, 36); display: block;" class="element">
			<h5>Houston</h5>
			<p>33°C / 91.4°F</p>
		</div>

		<div style="color: rgb(200, 21, 54); display: none;" class="element">
			<h5>Madrid</h5>
			<p>31°C / 87.8°F</p>
		</div>

		<div style="color: rgb(182, 29, 72); display: none;" class="element">
			<h5>Athens</h5>
			<p>30°C / 86°F</p>
		</div>

		<div style="color: rgb(163, 36, 91); display: none;" class="element">
			<h5>Lisbon</h5>
			<p>27°C / 80.6°F</p>
		</div>

		<div style="color: rgb(145, 43, 109); display: none;" class="element">
			<h5>Rome</h5>
			<p>27°C / 80.6°F</p>
		</div>

		<div style="color: rgb(127, 51, 127); display: none;" class="element">
			<h5>Moscow</h5>
			<p>23°C / 73.4°F</p>
		</div>

		<div style="color: rgb(109, 58, 145); display: none;" class="element">
			<h5>Los Angeles</h5>
			<p>22°C / 71.6°F</p>
		</div>

		<div style="color: rgb(91, 65, 163); display: none;" class="element">
			<h5>San Francisco</h5>
			<p>22°C / 71.6°F</p>
		</div>

		<div style="color: rgb(72, 72, 182); display: none;" class="element">
			<h5>Lima</h5>
			<p>19°C / 66.2°F</p>
		</div>

		<div style="color: rgb(54, 80, 200); display: none;" class="element">
			<h5>Sydney</h5>
			<p>18°C / 64.4°F</p>
		</div>

		<div style="color: rgb(36, 87, 218); display: none;" class="element">
			<h5>Johannesburg</h5>
			<p>17°C / 62.6°F</p>
		</div>

		<div style="color: rgb(18, 94, 236); display: none;" class="element">
			<h5>Buenos Aires</h5>
			<p>16° / 60.8°F</p>
		</div>

	</div>

	<div class="pagination toppagination"></div>
</div>

<script type="text/javascript">

(function($, window) {

	var B1, B2, TABLE, CURTAB, STAT, PRIME = new Array();

	var Prev = {
		start: 0,
		stop: 0
	}, TabPage, Paging = [], CONT;


	window.toggle = function(id) {

		$('#' + id).slideToggle("slow", function() {});
	}

	window.setNumber = function(num) {

		TabPage.setOptions({
			page: 1
		});
		TabPage.setNumber(num);
		TabPage.setPage(); // reads options and redraw contents

		for (var i = Paging.length; --i; ) {
			Paging[i].setOptions({
				lapping: lap,
				page: 1
			});
			Paging[i].setNumber(num);
			Paging[i].setPage(); // reads options and redraw contents
		}
		$('.number').html(num);
	}

	window.setLapping = function(lap) {

		TabPage.setOptions({
			lapping: lap * 4,
			page: 1
		});
		TabPage.setPage(); // reads options and redraw contents

		for (var i = Paging.length; i--; ) {
			Paging[i].setOptions({
				lapping: lap,
				page: 1
			});
			Paging[i].setPage(); // reads options and redraw contents
		}
		$('.lapping').html(lap);
	}

	window.setPageStyle = function(style) {

		$("link").each(function() {

			var href = this.getAttribute('href');

			if (href && href.substr(0, "/static/pagination/".length) == "/static/pagination/") {
				this.setAttribute('href', '/static/pagination/' + style + ".css");
			}
		});
	}

	$(function() {


		/* First example, using a colorized list */

		var k = 0;

		CONT     = $('#content div.element'),

		TABLE    = $('#table tr'),
		B1       = $('#b1'),
		B2       = $('#b2'),
		STAT     = $('#stat'),

		CONT.each(function() {
			$(this).css('color', $.xcolor.gradientlevel('#f00', 'hsb(216,180,100)', k++, CONT.length));
		});

		Paging[0] = $(".a .toppagination").paging(CONT.length, {
			onSelect: function() {

				var data = this.slice;

				CONT.slice(Prev[0], Prev[1]).css('display', 'none');
				CONT.slice(data[0], data[1]).fadeIn("slow");

				Prev = data;

				return true; // locate!
			},
			onFormat: function (type) {

				switch (type) {

					case 'block':

						if (!this.active)
							return '<span class="disabled">' + this.value + '</span>';
						else if (this.value != this.page)
							return '<em><a href="#' + this.value + '">' + this.value + '</a></em>';
						return '<span class="current">' + this.value + '</span>';

					case 'right':
					case 'left':

						if (!this.active) {
							return '';
						}
						return '<a href="#' + this.value + '">' + this.value + '</a>';

					case 'next':

						if (this.active) {
							return '<a href="#' + this.value + '" class="next">Next &raquo;</a>';
						}
						return '<span class="disabled">Next &raquo;</span>';

					case 'prev':

						if (this.active) {
							return '<a href="#' + this.value + '" class="prev">&laquo; Previous</a>';
						}
						return '<span class="disabled">&laquo; Previous</span>';

					case 'first':

						if (this.active) {
							return '<a href="#' + this.value + '" class="first">|&lt;</a>';
						}
						return '<span class="disabled">|&lt;</span>';

					case 'last':

						if (this.active) {
							return '<a href="#' + this.value + '" class="prev">&gt;|</a>';
						}
						return '<span class="disabled">&gt;|</span>';

					case 'fill':
						if (this.active) {
							return "...";
						}
				}
				return ""; // return nothing for missing branches
			},
			format: '[<   ncnnn!  >]',
			perpage: 3,
			lapping: 0,
			page: null // we await hashchange() event
		}),


		$(window).hashchange(function() {

			if (window.location.hash)
				Paging[0].setPage(window.location.hash.substr(1));
			else
				Paging[0].setPage(1); // we dropped "page" support and need to run it by hand
		});

		$(window).hashchange();


		/* Second example, using a table navigable via buttons */


		B1.click(function() {
			TabPage.setPage(CURTAB - 1);
		}),

		B2.click(function() {
			TabPage.setPage(CURTAB + 1);
		}),

		TabPage = $("#tabpage").change(function () {
			TabPage.setPage($(this).val());
		}).paging(100, {
			onSelect: function (page) {

				var k = this.slice[0];
				var data = this;

				TABLE.each(function(i) {

					$(this).find("td").each(function(j){

						if (j >= 1) {

							if (k < data.number) {
								var str = "";

								if (0 === PRIME[k]) {
									// int
									this.style.color = '#ccc'
								} else {

									this.style.color = '#000';

									if (PRIME[k] & 1) {
										// prime
										str+= 'P';
									}

									if (PRIME[k] & 2) {
										// fibonacci
										str+= 'F';
									}

									if (PRIME[k] & 4) {
										// perfect
										str+= 'E';
									}

									if (PRIME[k] & 8) {
										// 2^
										str+= "B";
									}

									if (PRIME[k] & 16) {
										// 10^
										str+= "T";
									}
								}

								this.innerHTML = "<span>" + k + "</span><sub> "+ str + "</sub>";
							} else {
								this.style.color = '#000';
								this.innerHTML="<span>&nbsp;</span><sub></sub>";
							}

							++k;
						} else
							this.innerHTML = '<span>' + (i + (40 - data.lapping) * (page - 1) / 4) + '</span>';

					});

				});


				STAT.html('(' + this.slice[0] + ' - ' + (this.slice[1] - 1) + ')');

				return false; // don't locate!
			},
			onFormat: function (type) {

				switch (type) {

					case 'prev':
						CURTAB = this.page;
						B1.attr('disabled', !this.active);
						break;

					case 'next':
						CURTAB = this.page;
						B2.attr('disabled', !this.active);
						break;

					case 'fill':
						//STAT.html('(showing ' + (1 + this.start) + ' - ' + this.stop + ')');
						break;

					case 'block':

						if (!this.active)
							return '<option class="disabled">' + this.value + '</option>';
						else if (this.value != this.page)
							return '<option>' + this.value + '</option>';
						return '<option style="font-weight:bold;" selected="selected">' + this.value + '</option>';
				}
				return "";
			},
			format: '<.> *',
			perpage: 40,
			lapping: 0,
			page: 0
		});


		/* Site navigation on the right hand side */

		var ok = 0, scroll = $('#scroll');

		scroll.find('a').each(function(i) {
			$(this).delay(i * 200).fadeIn((1 + i) * 300, function() {

				if (5 == ++ok) {

					scroll.paging(5, {
						page: 1,
						perpage: 1,
						format: 'nnnnn',
						onFormat: function() {

							if (this.page == this.value)
								return '<a class="current"></a>';
							return '<a ></a>';
						},
						onSelect: function(page) {

							if (window.SCROLLED)
								$.scrollTo('#ex' + page, 800, {
									easing:'easeOutBounce'
								});
							window.SCROLLED = 1;
							return false;
						}
					});
				}


			});
		});


		/* Example three, a public flickr stream navigation */

		var selectedImg = null;

		$.getJSON("http://api.flickr.com/services/feeds/photos_public.gne?jsoncallback=?", {
			tags: "city,nature",
			format: "json"
		},
		function(data) {

			$.each(data.items, function(i, item) {


				var rotateCSS = 'rotate(' + (Math.random() * 30 - 15) + 'deg)';

				$("<img/>")
					.attr('src', item.media.m)
					.css({
						'-moz-transform': rotateCSS,
					    '-webkit-transform': rotateCSS,
						'-o-transform': rotateCSS,
						'transform': rotateCSS
					})
					.css('top', i * 10 + "px")
					.appendTo("#images");
				
			});


			$('#imagepager').paging(20,{

				onSelect: function(page) {

					$("#imageshadow").animate({
						left: ((page-1)*19-2) + "px"
					});


					if (null !== selectedImg) {
						$('#images').find("img").eq(selectedImg).animate({
							left: '0px'
						}, function() {
							$('#images').find("img").eq(page-1).animate({
								left: '400px'
							});
						});
					} else {
						$('#images').find("img").eq(page-1).animate({
							left: '400px'
						});
					}

					selectedImg = page-1;

					return false;
				},
				onFormat: function() {

						if (this.value != this.page)
							return '<a style="left:'+((this.pos-1)*19)+'px;" href="#' + this.value + '"></a>';
						return '<span style="left:'+((this.pos-1)*19)+'px;background-color:#fc0;"></span>';
				},
				format: '*',
				perpage: 1,
				page:1
			});

		});




var formats = [

'{ // First < > Last 1 2  50 51 52 53 54 55 ... 142 143\n\
	number: 1000,\n\
	options: {\n\
		format: "[ < > ] . (qq -) nnncnnn (- pp)",\n\
		lapping: 1,\n\
		perpage: 8,\n\
	},\n\
	labels: {\n\
		first: "First",\n\
		leap: " &nbsp; ",\n\
		last: "Last",\n\
		prev: "<",\n\
		next: ">",\n\
		fill: "..."\n\
	}\n\
}',
'{// <prev 1 2 3 4 5 6 7 next>\n\
	number: 30,\n\
	options: {\n\
		format: "< nnnnnnn! >"\n\
	},\n\
	labels: {\n\
		prev: "&laquo; prev",\n\
		next: "next &raquo;"\n\
	}\n\
}',
'{// < > 1 2 3 4 5 6 7 8\n\
	number: 4,\n\
	options: {\n\
		format: "<> nnnnnnnnn",\n\
		perpage: 1\n\
	},\n\
	labels: {\n\
		prev: "&lt;",\n\
		next: "&gt;"\n\
	}\n\
}',
'{// |<< <Prev - 1 2 3 4 - Next> >>|\n\
	number: 50,\n\
	options: {\n\
		format: "[< - nncn - >]"\n\
	},\n\
	labels: {\n\
		first: "|&lt;&lt;",\n\
		last: "&gt;&gt;|",\n\
		prev: "&lt; Prev",\n\
		next: "Next &gt;",\n\
		fill: " - ",\n\
	}\n\
}',
'{// PAGE 1 OF 1122 < 1 2 3 4 5 6 7 8 ... 1121 1122  >\n\
	number: 11220,\n\
	options: {\n\
		format: "- < (qq -) ncnnnnnn (- pp) >"\n\
	},\n\
	labels: {\n\
		fill: function(data) {\n\
			if (data.pos > 1)\n\
				return "...";\n\
			return "PAGE " + data.page + " OF " + data.pages;\n\
		},\n\
		prev: "&lt;",\n\
		next: "&gt;"\n\
	}\n\
}',
'{// <Older | Newer>\n\
	number: 50,\n\
	options: {\n\
		format: ". < - >"\n\
	},\n\
	labels: {\n\
		leap: function(data) {\n\
			return "PAGE " + data.page + " OF " + data.pages;\n\
		},\n\
		fill: " | ",\n\
		prev: "&ltOlder",\n\
		next: "Newer&gt;"\n\
	}\n\
}',
'{// <Back | Page: 1 ... 4 5 6 7 | Forward>\n\
	number: 341,\n\
	options: {\n\
		format: "< . (q -) nnnnn (- p) . >"\n\
	},\n\
	labels: {\n\
		leap: function(data) {\n\
			if (data.pos == 1)\n\
				return " | Page: " + data.page + " ";\n\
			return " | ";\n\
		},\n\
		fill: "...",\n\
		prev: "&lt;Back",\n\
		next: "Forward&gt;"\n\
	}\n\
}',
'{// 1 2 3 4 5 6 7 8 9 10 Next\n\
	number: 50,\n\
	hideInactive: true,\n\
	options: {\n\
		format: "< * >"\n\
	},\n\
	labels: {\n\
		prev: "Prev",\n\
		next: "Next"\n\
	}\n\
}',
'{// o o o o o x o o o\n\
	number: 99,\n\
	options: {\n\
		format: "*",\n\
	},\n\
	labels: {\n\
		current: "x",\n\
		number: "o"\n\
	}\n\
}',
'{// prev [1-25][26-50][51-75][76-100] next\n\
	number: 57,\n\
	options: {\n\
		format: "< * >"\n\
	},\n\
	labels: {\n\
		prev: "prev",\n\
		next: "next",\n\
		current: function(data) {\n\
			var u, l = 1 + (u = data.value * (data.perpage - data.lapping) + data.lapping) - data.perpage;\n\
				u = Math.min(u, data.number);\n\
			return "<strong>[" + l + "-" + u + "]</strong>";\n\
		},\n\
		number: function(data) {\n\
			var u, l = 1 + (u = data.value * (data.perpage - data.lapping) + data.lapping) - data.perpage;\n\
				u = Math.min(u, data.number);\n\
			return "[" + l + "-" + u + "]";\n\
		}\n\
	}\n\
}'];



		$("#formatlinks a").each(function(i) {

			$(this).click(function() {

				$("#formatex").val(formats[i]);
				ForExCB.apply($("#formatex"));
			});

		});

		function parseOptions(value) {

			try {
				var res = eval("(" + value + ")");
				$("#formatex").css("background", "#fff");
			} catch(e) {
				$("#formatex").css("background", "#c00");
				return;
			}

			if (!(res.options && res.labels)) return;

			var ret = {
				raw: res,
				options: {
				lapping: 0,
				perpage: 10,
				onFormat: function (type) {

						if (!this.active && res.hideInactive)
							return "";

					var value;

					if (type == "block") {
							if (this.value == this.page) {
								if (typeof res.labels.current === "string")
									value = res.labels.current;
								else if (typeof res.labels.current === "function")
									value = res.labels.current(this);
							} else {
								if (typeof res.labels.number === "string")
									value = res.labels.number;
								else if (typeof res.labels.number === "function")
									value = res.labels.number(this);
							}
					} else {
						if (typeof res.labels[type] === "string")
							value = res.labels[type];
						else if (typeof res.labels[type] === "function")
							value = res.labels[type](this);
					}



					switch (type) {

						case 'block':
							if (!this.active)
								return '<span class="disabled">' + (value || this.value) + '</span>';
							else if (this.value != this.page)
								return '<em><a href="#' + this.value + '">' + (value || this.value) + '</a></em>';
							return '<span class="current">' + (value || this.value) + '</span>';

						case 'right':
						case 'left':

							if (!this.active) {
								return '';
							}
							return '<a href="#' + this.value + '">' + (value || this.value) + '</a>';

						case 'next':

							if (this.active) {
								return '<a href="#' + this.value + '" class="next">' + (value || 'Next &raquo;') + '</a>';
							}
							return '<span class="disabled">' + (value || 'Next &raquo;') + '</span>';

						case 'prev':

							if (this.active) {
								return '<a href="#' + this.value + '" class="prev">' + (value || '&laquo; Previous') + '</a>';
							}
							return '<span class="disabled">' + (value || '&laquo; Previous') + '</span>';

						case 'first':

							if (this.active) {
								return '<a href="#' + this.value + '" class="first">' + (value || '|&lt;') + '</a>';
							}
							return '<span class="disabled">' + (value || "|&lt;") + '</span>';

						case 'last':

							if (this.active) {
								return '<a href="#' + this.value + '" class="prev">' + (value||"&gt;|") + '</a>';
							}
							return '<span class="disabled">' + (value||"&gt;|") + '</span>';

						case "leap":
						case 'fill':
							if (this.active) {
								return value||"...";
							}
					}
					return ""; // return nothing for missing branches
				},
				onSelect: function() {
					return false;
				},
				page: 1,
				format: "[< nncnn > ]"
				},
				number: 100
			};

			$.extend(ret.options, res.options);

			if (res.options)
				ret.number = res.number;

			return ret;
		}

		var ForTPL = null, ForExCB, ForExample = $("#formatex");

		ForExample.ready(ForExCB = function() {

			var tmp;

			if (ForTPL === null) {
				ForTPL = document.getElementById("forpaging").innerHTML;
				$("#forpaging").addClass("prettyprint");

				tmp = parseOptions(formats[0]);

			} else {
				tmp = parseOptions($(this).val());
			}

			if (tmp) {
				ForPaging.setOptions(tmp.options);
				ForPaging.setNumber(tmp.number)
				ForPaging.setPage(tmp.page);

				var tpl = ForTPL.replace(/\[\[\[number\]\]\]/g,	tmp.number)
								.replace(/\[\[\[format\]\]\]/g,	tmp.options.format)
								.replace(/\[\[\[perpage\]\]\]/g,tmp.options.perpage)
								.replace(/\[\[\[page\]\]\]/g,	tmp.options.page)
								.replace(/\[\[\[lapping\]\]\]/g,tmp.options.lapping);

				var alt = {
					current: "' + this.value + '",
					number: "' + this.value + '",
					next: "Next >",
					prev: "< Prev",
					first: "|<",
					last: ">|",
					leap: "...",
					fill: "..."
				};

				$("#forpaging").html(
					tpl.replace(/\[\[(current|number|next|prev|first|last|leap|fill)\]\]/g, function() {
						var m = RegExp.$1;

						return (tmp.raw.labels[m] === undefined ? alt[m] : tmp.raw.labels[m]);
					})
				);

				prettyPrint();
			}

		}).change(ForExCB).keyup(ForExCB);

		ForExample.val(formats[0]);

		var $opt = parseOptions(formats[0]);

		var ForPaging = $(".formatpagination").paging($opt.number, $opt.options);

	});


	// Generate the number table between page load and DOM-ready

	var i,j;
	for(i = 10000; i--; PRIME[i] = 1);
	for(i = 2; i <= 100; ++i)
		if (PRIME[i])
			for(j = i; j * i < 10000; ++j)
				PRIME[i * j] = 0;

	PRIME[0] = PRIME[1] = 2;
	j = [2, 3, 5, 8, 13, 21, 34, 55, 89, 144, 233, 377, 610, 987, 1597, 2584, 4181, 6765];

	for (i = j.length; i--; PRIME[j[i]]|= 2);

	PRIME[6]|= 4;
	PRIME[28]|= 4;
	PRIME[496]|= 4;
	PRIME[8128]|= 4;

	for (i=1; i<10000; i<<=1) {
		PRIME[i]|= 8;
	}

	for (i=1; i<10000; i*=10) {
		PRIME[i]|= 16;
	}

})(jQuery, this);

</script>
</body>
</html>



ประวัติการแก้ไข
2012-05-25 12:18:46
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2012-05-25 12:09:39 By : t-monroe
 


 

No. 6



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



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


ทำได้แล้วค่ะ แต่ว่าลองใช้กับข้อมูลปริมาณมากที่ดึงมาจากฐานข้อมูล รู้สึกว่ามันโหลดช้าๆ มากๆ มันเกี่ยวกันไหมคะ
เหมือนมัน select ข้อมูลออกมาก่อนทั้งหมดแล้วค่อยมาแบ่ง


ประวัติการแก้ไข
2012-05-25 13:54:56
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2012-05-25 13:53:42 By : Avrill
 


 

No. 7



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

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

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


ใช่ครับ ข้อเสียของสคริปต์พวกนี้ คงเป็นเรื่องการโหลดทั้งหมดก่อน แล้วค่อยแบ่งหน้า
ผมรบกวนฝากโค้ดของผมไปทดลองหน่อยน่ะครับ
พัฒนาเอง เพิ่งเสร็จเดี๋ยวนี้ล่ะครับ
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2012-05-25 14:00:58 By : sakuraei
 


 

No. 8



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

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

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


thaicreate-078884

Code (PHP)
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
  <title>https://www.thaicreate.com/php/forum/078884.html - ใครมีตัวอย่าง Source code PHP แบ่งหน้า แล้ววางลิ้งไว้ได้ทั้งด้านบน-ล่าง บ้างคะ  </title>
  <meta name="Generator" content="EditPlus">
  <meta name="Author" content="Unidentifier">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
  <meta http-equiv="Content-Type" content="text/html; charset=utf8" />
  <script src="http://code.jquery.com/jquery-latest.js"></script>
 <style>
 #nav{
	color:white;
	text-align:center;
	background-color:#6666ff;
	width:30px;
	display:inline-block;
	padding:5px;
	border:5px solid #dadada;
	-moz-border-radius: 15px;
	border-radius: 15px;
	cursor:default;
 }
 .pagination{
	background-color:#dadada;
	padding:10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
 }
 </style>
  </head>

 <body>
 <script type="text/javascript"> 
$(document).ready(function(){

			var perpage=3;	// จำนวนรายการต่อหนึ่งหน้า			
			var allNum = $("div#content div.element").length;  // นับจำนวน ข้อมูลทั้งหมดว่ามีกี่ชุด			
			var paginator="";	// สร้าง navigator 
			for(i=1; i<=Math.round(parseInt(allNum)/parseInt(perpage)); i++){
				paginator += "<span id='nav'>"+i+"</span>";
			}
			
			$("div.pagination").each(function(){  // สร้าง navigator ที่ด้านบนและด้านล่างของหน้าจอ
				$(this).html(paginator);
			}); 

			// ทำการแทรก div เพื่อกำกับเลขหน้า  นับตามจำนวนรายการต่อหนึ่งหน้า
			var count=0,
			pagecount=1,
			regenerator="<div class='page"+pagecount+"' for='all'>";
			$("div#content div.element").each(function(){
				count++;
				regenerator += "<div>"+$(this).html()+"</div>";
				if(!(count%perpage)){
					pagecount++;
					regenerator +="</div><div class='page"+pagecount+"' for='all'>";
				}			
			});
			regenerator +="</div>";			
			$("div#content").empty().html(regenerator);
			$("div[for=all]").hide();	//ซ่อนข้อมูลทั้งหมดก่อน
			$("div.page1").show(400);	//แสดงเฉพาะหน้าที่ 1	
			//ดักการกดคีย์บอร์ดที่ navigator-page number ที่้ด้านบนและล่างของจอภาพ
			$("div.pagination span#nav").click(function(){					
					var index = $(this).text();					
					$("div[for=all]").hide(400);
					$("div.page"+index).show(400);	
			});
			
});


</script>
<div id="test"></div>
<div id="exX">Examples</div>

<h3 id="ex2">Using Paging with multiple paginators</h3>


<h4>Average temperature of some cities in June</h4>

<div class="pagination"></div>

<div id="content">

<div class="element">
<h5>Las Vegas</h5>
<p>37°C / 98.6°F</p>
</div>
<div class="element">
<h5>Cairo</h5>
<p>35°C / 95°F</p>
</div>
<div class="element">
<h5>Houston</h5>
<p>33°C / 91.4°F</p>
</div>
<div class="element">
<h5>Madrid</h5>
<p>31°C / 87.8°F</p>
</div>
<div class="element">
<h5>Athens</h5>
<p>30°C / 86°F</p>
</div>
<div class="element">
<h5>Lisbon</h5>
<p>27°C / 80.6°F</p>
</div>
<div class="element">
<h5>Rome</h5>
<p>27°C / 80.6°F</p>
</div>
<div class="element">
<h5>Moscow</h5>
<p>23°C / 73.4°F</p>
</div>
<div class="element">
<h5>Los Angeles</h5>
<p>22°C / 71.6°F</p>
</div>
<div class="element">
<h5>San Francisco</h5>
<p>22°C / 71.6°F</p>
</div>
<div class="element">
<h5>Lima</h5>
<p>19°C / 66.2°F</p>
</div>
<div class="element">
<h5>Sydney</h5>
<p>18°C / 64.4°F</p>
</div>
<div class="element">
<h5>Johannesburg</h5>
<p>17°C / 62.6°F</p>
</div>
<div class="element">
<h5>Buenos Aires</h5>
<p>16° / 60.8°F</p>
</div>
</div>

<div class="pagination"></div>
 </body>
</html>

แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2012-05-25 14:03:00 By : sakuraei
 


 

No. 9



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



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


แสดงว่าใช้กับพวกฐานข้อมูลเยอะๆไม่ได้

มีแบบที่ใช้กับ php mysql ไหมคะ ที่แบ่งหน้าแล้ว วางได้ทั้งบนและล่างแบบนี้
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2012-05-25 14:45:25 By : Avrill
 


 

No. 10



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

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

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


ข้อมูลมากระดับไหนครับ หลักพัน หรือหลักหมื่นครับ
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2012-05-25 14:51:22 By : sakuraei
 


 

No. 11



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

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

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


อาจจะทดลองตามนี้ครับ https://www.thaicreate.com/community/php-mysql-pagination.html
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2012-05-25 14:55:31 By : sakuraei
 


 

No. 12



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

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

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

ข้อมูลเยอะก็แบ่งคิวรี่มาสิคะ ใช้ LIMIT เอา
การแบ่งหน้าก็แค่นับจำนวน record แล้วเอามาแบ่ง
ตอนแสดงข้อมูลก็ใส่ limit ตามหน้านั้น ๆ เข้าไป มันก็จะดึงมาทีละหน้าค่ะ
อย่างกำหนดไว้ว่า หน้าละ 10 record ก็คิวรี่ดึงมาแค่ 10 record
ถ้าโจทย์ในการแบ่งหน้าคือ ข้อมูลเยอะ โหลดช้า
ก็เลยแบ่งหน้าใหม่มันทำงานได้เร็วขึ้น ก็ต้องแบ่งการดึงข้อมูลด้วยค่ะ

เรื่องความสวยงามเรื่องปุ่ม css ช่วยได้ค่ะ
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2012-05-25 15:01:48 By : ultrasiam
 


 

No. 13



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



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


ตอบความคิดเห็นที่ : 12 เขียนโดย : ultrasiam เมื่อวันที่ 2012-05-25 15:01:48
รายละเอียดของการตอบ ::
.ถ้าแบ่งหน้าแบบธรรมดา แบบ limit เอา ทำได้อยู่ค่ะ พอดีว่าเราอยากได้แบบที่มี paginator ทั้งบน และ ล่าง ค่ะ
เลยลองใช้แบบ jQuery-paginator แต่พอข้อมูลเยอะๆ มันโหลดช้า

ขอบคุณที่แนะนำจ้า

แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2012-05-25 15:08:47 By : Avrill
 


 

No. 14



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



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


ตอบความคิดเห็นที่ : 10 เขียนโดย : sakuraei เมื่อวันที่ 2012-05-25 14:51:22
รายละเอียดของการตอบ ::
..เท่าที่ลองดูแค่ประมาณ 300 เรคคอร์ด แคนี้ก็ช้าแล้วค่ะ

แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2012-05-25 15:10:42 By : Avrill
 


 

No. 15



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

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

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


มันไม่มีอันไหนใช้ได้ดีหรอกครับ ถ้าไม่ query หา result เอาทีละเพจ
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2012-05-25 15:12:55 By : ikikkok
 


 

No. 16



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

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

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


Quote:
เท่าที่ผมลองดูที่ 400 เรคคอร์ด ก็ยังเร็วอยู่น่ะครับ



thaicreate-078884-1
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2012-05-25 15:21:10 By : sakuraei
 


 

No. 17



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

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

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


แต่ขอเวลาปรับแก้ไข เรื่องจำนวนหน้าที่มีมากๆ ให้เป็น 1 2 3 4 5 6 7 8 9 .... 20 30 40 50 Last
คิดว่าจะใช้ query ของ mysql ร่วมด้วย รับรองว่าไม่ช้าแน่นอนครับ
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2012-05-25 15:23:43 By : sakuraei
 


 

No. 18



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



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


ตอบความคิดเห็นที่ : 16 เขียนโดย : sakuraei เมื่อวันที่ 2012-05-25 15:21:10
รายละเอียดของการตอบ ::
ลองใน localhost อาจจะเร็วอยู่ค่ะ เราลองในโฮสจิงเลย เน็ตก็ไม่ช้านะ แต่เวลาโหลดแตกต่างกันเลย

แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2012-05-25 15:29:08 By : Avrill
 


 

No. 19



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

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

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

ตอบความคิดเห็นที่ : 13 เขียนโดย : Avrill เมื่อวันที่ 2012-05-25 15:08:47
รายละเอียดของการตอบ ::
แค่อยากจะบอกว่า paginator เนี่ยเราสร้างเองไว้ตรงไหนก็ได้ค่ะ ถ้า jquery มันช่วยไม่ได้จริงๆ ขอให้ค้นพบเร็ว ๆ นะคะ

แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2012-05-25 15:34:23 By : ultrasiam
 


 

No. 20



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

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

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


ตอบความคิดเห็นที่ : 18 เขียนโดย : Avrill เมื่อวันที่ 2012-05-25 15:29:08
รายละเอียดของการตอบ ::
ท่าจะจริงครับ อยู่ที่ความเร็วของโฮสท์ที่เราเอาไปฝากไว้

รบกวนช่วยทดสอบโค้ดของผมด้วยจะเป็นพระคุณอย่างมาก อยากรู้ว่าพอรันจริงบนโฮสท์จะอืดมากมั๊ย



ประวัติการแก้ไข
2012-05-25 15:38:03
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2012-05-25 15:36:01 By : sakuraei
 


 

No. 21



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

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

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


หลักร้อยพอไปได้แน่นอนครับ รวมถึง colume ต้องน้อยด้วย ถึงได้บอกว่า ถ้า query ออกมาแล้ว fetch มาไว้ทั้งหมด ภาระหนักอึ้งทั้่ง server และ client ครับ ดีไม่ได้ timeout เอา

วิธีที่ดีหน่อยก็คงต้องใช้ limit ใน mysql คือ get result ทีละหน้า แต่ count record บอกมาด้วยว่าทั้งหมดเท่าไหร่ เพื่อเอาไปแสดง paging ครับ

ขอมูลเยอะๆ ลองมาแล้ว เดี้ยงครับ ต่อให้ Localhost ก็เหอะ ใช้พวก cache อะไรต่างๆ มาช่วยก็ช่วยได้นิดหน่อยครับ

จากประสบการณ์ ฟังธงว่าไม่ควรทำวิธีนี้ครับ ถ้าข้อมูลเยอะขนาดนั้น แล้วควรจะทำระบบ cache หรือว่า backup ข้อมูลเก่าๆ ออกไปที่อื่นซะ จะได้เร็วขึ้นนะครับ
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2012-05-25 15:49:24 By : ikikkok
 


 

No. 22



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



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


ตอบความคิดเห็นที่ : 20 เขียนโดย : sakuraei เมื่อวันที่ 2012-05-25 15:36:01
รายละเอียดของการตอบ ::
.ทดสอบแล้วค่ะ ค่อนข้างช้าเหมือนกันค่ะ

แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2012-05-25 16:00:05 By : Avrill
 


 

No. 23



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



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


ตอบความคิดเห็นที่ : 19 เขียนโดย : ultrasiam เมื่อวันที่ 2012-05-25 15:34:23
รายละเอียดของการตอบ ::
.ขอบคุณค่ะ ที่แนะนำ ลองหาใน google ก็มีแต่แบบวางไว้ด้านล่างอย่างเดียวเลย หาดูที่เป็นแบบ บนและล่าง ไม่ค่อยมี หรือว่าเราหาไม่เป็น

แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2012-05-25 16:04:49 By : Avrill
 


 

No. 24



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



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


ตอบความคิดเห็นที่ : 21 เขียนโดย : ikikkok เมื่อวันที่ 2012-05-25 15:49:24
รายละเอียดของการตอบ ::
ขอบคุณที่แนะนำค่ะ

แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2012-05-25 16:06:23 By : Avrill
 


 

No. 25



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

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

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

Pagination
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2012-05-26 13:33:58 By : nautilus
 

   

ค้นหาข้อมูล


   
 

แสดงความคิดเห็น
Re : ใครมีตัวอย่าง Source code PHP แบ่งหน้า แล้ววางลิ้งไว้ได้ทั้งด้านบน-ล่าง บ้างคะ (มีรูป)
 
 
รายละเอียด
 
ตัวหนา ตัวเอียง ตัวขีดเส้นใต้ ตัวมีขีดกลาง| ตัวเรืองแสง ตัวมีเงา ตัวอักษรวิ่ง| จัดย่อหน้าอิสระ จัดย่อหน้าชิดซ้าย จัดย่อหน้ากึ่งกลาง จัดย่อหน้าชิดขวา| เส้นขวาง| ขนาดตัวอักษร แบบตัวอักษร
ใส่แฟลช ใส่รูป ใส่ไฮเปอร์ลิ้งค์ ใส่อีเมล์ ใส่ลิ้งค์ 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 01
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 อัตราราคา คลิกที่นี่