Forgot Password ??

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

	Registered : 109,037

HOME > PHP > PHP Forum > อยากใช้ php ดึงรูปภาพ จากโฟลเดอร์ มาแสดง พร้อม เทคนิค แบ่งหน้าพร้อมเรียงรูปตามรายชื่อ

อยากใช้ php ดึงรูปภาพ จากโฟลเดอร์ มาแสดง พร้อม เทคนิค แบ่งหน้าพร้อมเรียงรูปตามรายชื่อ

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

Guest

พี่ๆท่านใดพอมีวิธีการดึงรูปจากโฟลเดอร์มาแสดงแล้วแบ่งหน้าบ้างครับ และให้รูปเรียงตามชื่อเช่น 1.jpg 2.jpg อ่ะครับ ผมทำได้แค่
Code (PHP)

<div id="container">

<div id="heading">
<h1>ภายบรรยากาศแม่ลูกร่วมทำบุตรตักบาตรกิจกรรมวันแม่สิงหาคม53</h1>
</div>

<div id="gallery">

<?php

$directory = 'gallery/Mother-Day53/';
$allowed_types=array('jpg','jpeg','gif','png');
$file_parts = scandir($directory );
/*$file_parts=array();*/

$ext='';
$title='';
$i=0;

$dir_handle = @opendir($directory) or die("There is an error with your image directory!");

while ($file = readdir($dir_handle)) 
{
	if($file=='.' || $file == '..') continue;
	
	$file_parts = explode('.',$file);
	$ext = strtolower(array_pop($file_parts));

	$title = implode('.',$file_parts);
	$title = htmlspecialchars($title);
	
	$nomargin='';
	
	if(in_array($ext,$allowed_types))
	{
		if(($i+1)%4==0) $nomargin='nomargin';
	

		echo '
		<div class="pic '.$nomargin.'" style="background:url('.$directory.'/'.$file.') no-repeat 50% 50%;">
		<a href="'.$directory.'/'.$file.'" title="'.$title.'" target="_blank">'.$title.'</a>
		</div>';
		
		$i++;
	}
}
   


closedir($dir_handle);

?>

คือตอนที่ผมลองรันบนเครื่องไม่ได้อัพขึ้นเซฟเวอร์มันก็เรียงรูปตามชื่อน่ะครับ ผมมีรูปอยู่ในโฟลเดอร์อยู่ 30 รูป ตั้งชื่อ 1.jpg - 30.jpg
แต่พอผมอัพขึ้นเซฟเวอร์ดันไม่เรียงรูปให้ครับรูปไม่เรียงตามรายชื่อ อยากให้เรียงตามรายชื่ออ่ะครับ เช่น 1.jpg 2.jpg - 30.jpg
ประมาณนี้ครับ

Tag : PHP, MySQL, HTML/CSS, JavaScript, jQuery

Date : 2010-08-19 16:46:38

By : เด็กหมุย

View : 9582

Reply : 4

No. 1

TC Admin

โพสกระทู้ ( 74,058 )
บทความ ( 838 )

เคยเขียนไว้น่ะครับ คือจะต้องโหลดไฟล์เข้ามาเก็บไว้ใน array ก่อนครับ เดียวเย็นนี้ถ้าไม่ลืมจะเขียนให้น่ะครับ

Date : 2010-08-19 17:31:12

By : webmaster

No. 2

Guest

อ่ะเอาไปเล่นครับหนุกๆ

<div id="container">

<div id="heading">
<h1>ภายบรรยากาศแม่ลูกร่วมทำบุตรตักบาตรกิจกรรมวันแม่สิงหาคม53</h1>
</div>

<div id="gallery">

<?php

$directory = 'F:/gallery/Mother-Day53/';
$allowed_types=array('jpg','jpeg','gif','png');
$file_parts = glob($directory);
/*$file_parts=array();*/

$filecount = count(glob("" . $directory . "*.*"));
$arrayFilePath = array();

$ext='';
$title='';
$i=0;

$dir_handle = @opendir($directory) or die("There is an error with your image directory!");

while ($file = readdir($dir_handle))
{
if($file=='.' || $file == '..') continue;

$file_parts = explode('.',$file);
$ext = strtolower(array_pop($file_parts));

$title = implode('.',$file_parts);
$title = htmlspecialchars($title);

$nomargin='';

if(in_array($ext,$allowed_types))
{
//if(($i+1)%4==0) $nomargin='nomargin';
$arrayFilePath[$i] = '<img src="'.$directory.'/'.$file.'" width="30%" height="70%"/>';
//echo '<img src="'.$directory.'/'.$file.'" width="30%" height="70%"/>';

// echo '
// <div class="pic '.$nomargin.'" style="background:url('.$directory.'/'.$file.') no-repeat 50% 50%;">
// <a href="'.$directory.'/'.$file.'" title="'.$title.'" target="_blank">'.$title.'</a>
// </div>';

$i++;
}
}

closedir($dir_handle);

$pageNumber = 1;

if (isset($_GET["page"]) != null) $pageNumber = $_GET["page"];

echo displayPaging( $filecount , 1,$pageNumber, "imgManage.php?page=" , $arrayFilePath );

?>

<?
function displayPaging( $total, $limit, $pagenumber, $baseurl, $arrImage ){
// how many page numbers to show in list at a time
$showpages = "26"; // 1,3,5,7,9...

// set up icons to be used
$icon_path = 'icons/';
$icon_param = 'align="middle" style="border:0px;" ';
$icon_first= '[First page]';
$icon_last= '[Lastpage]';
$icon_previous= '<< Previous';
$icon_next= 'Next >>';

///////////////////
///////////////////

// do calculations
$pages = ceil($total / $limit);
$offset = ($pagenumber * $limit) - $limit;
$end = $offset + $limit;

echo $arrImage[$pagenumber];

$html = "";

// prepare paging links
$html .= '<div id="pageLinks">';
// if first link is needed
if($pagenumber > 1) { $previous = $pagenumber -1;
$html .= '<a href="'.$baseurl.'1">'.$icon_first.'</a> ';
}
// if previous link is needed
if($pagenumber > 2) { $previous = $pagenumber -1;
$html .= '<a href="'.$baseurl.''.$previous.'">'.$icon_previous.'</a> ';
}
// print page numbers
if ($pages>=2) { $p=1;
$html .= "| Page: ";
$pages_before = $pagenumber - 1;
$pages_after = $pages - $pagenumber;
$show_before = floor($showpages / 2);
$show_after = floor($showpages / 2);
if ($pages_before < $show_before){
$dif = $show_before - $pages_before;
$show_after = $show_after + $dif;
}
if ($pages_after < $show_after){
$dif = $show_after - $pages_after;
$show_before = $show_before + $dif;
}
$minpage = $pagenumber - ($show_before+1);
$maxpage = $pagenumber + ($show_after+1);

if ($pagenumber > ($show_before+1) && $showpages > 0) {
$html .= " ... ";
}
while ($p <= $pages) {
if ($p > $minpage && $p < $maxpage) {
if ($pagenumber == $p) {
$html .= " <b>".$p."</b>";
} else {
$html .= ' <a href="'.$baseurl.$p.'">'.$p.'</a>';
}
}
$p++;
}
if ($maxpage-1 < $pages && $showpages > 0) {
$html .= " ... ";
}
}
// if next link is needed
if($end < $total) { $next = $pagenumber +1;
if ($next != ($p-1)) {
$html .= ' | <a href="'.$baseurl.$next.'">'.$icon_next.'</a>';
} else {$html .= ' | ';}
}
// if last link is needed
if($end < $total) { $last = $p -1;
$html .= ' <a href="'.$baseurl.$last.'">'.$icon_last.'</a>';
}
$html .= '</div>';
// return paging links
return $html;
}
?>

Date : 2010-08-19 23:12:20

By : burn

No. 3

Guest

ขอบคุณน่ะครับพี่ๆ แล้วกรณีนี้ผมใช้การ Preview ภาพด้วย jqery ด้วยครับถ้าเอาไปใช้ร่วมกันจะแทรกยังอ่ะครับ ตอนนี้ผมทำไว้ตามลิงค์อ่ะครับ แล้วตอนที่ผมรันอยู่ในเครื่องรูปก็จัดเรียงตาม ชื่อน่ะคือ รูปที่ 1.jpg - 30.jpg อะครับ ต่อพออัพขึ้นรูปไม่เรียงตามรายชื่อเลยครับ
http://www.oonraksamui.com/Mother-Day53.php
ผมแทรกโค๊ด CSS ทำพรีวิวรูปตามลิงค์ด้านบนมาให้พี่ดูด้วยครับ แล้วกรณีที่จะใช้ การแบ่งหน้ารวมกับ แบบโค๊ดด้านบน ต้องแทรกยังไงครับ
Code (PHP)

body,h1,h2,h3,p,td,quote,small,form,input,ul,li,ol,label{
	margin:0px;
	padding:0px;
	font-family:Arial, Helvetica, sans-serif;
}

body{
	margin-top:20px;
	color:white;
	font-size:13px;
	background-color:#222222;
}

.clear{
	clear:both;
}

a, a:visited {
	color:#00BBFF;
	text-decoration:none;
	outline:none;
}

a:hover{
	text-decoration:underline;
}

#container{
	width:890px;
	margin:20px auto;
}

#heading,#footer{
	background-color:#2A2A2A;
	border:1px solid #444444;
	height:20px;
	padding:6px 0 25px 15px;
	margin-bottom:30px;
	overflow:hidden;
}

#footer{
	height:10px;
	margin:20px 0 20px 0;
	padding:6px 0px 11px 75px;
}

div.nomargin{
	margin-right:0px;
}

.pic{
	float:left;
	margin:0 15px 15px 0;
	border:5px solid white;
	width:200px;
	height:250px;
}

.pic a{
	width:200px;
	height:250px;
	text-indent:-99999px;
	display:block;
}

h1{
	font-size:28px;
	font-weight:bold;
	font-family:"Trebuchet MS",Arial, Helvetica, sans-serif;
}

h2{
	font-weight:normal;
	font-size:14px;
	
	color:white;
}

Code

#jquery-overlay {
position: absolute;
top: 0;
left: 0;
z-index: 90;
width: 100%;
height: 500px;
}
#jquery-lightbox {
position: absolute;
top: 0;
left: 0;
width: 100%;
z-index: 100;
text-align: center;
line-height: 0;
}
#jquery-lightbox a img { border: none; }
#lightbox-container-image-box {
position: relative;
background-color: #fff;
width: 250px;
height: 250px;
margin: 0 auto;
}
#lightbox-container-image { padding: 10px; }
#lightbox-loading {
position: absolute;
top: 40%;
left: 0%;
height: 25%;
width: 100%;
text-align: center;
line-height: 0;
}
#lightbox-nav {
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
z-index: 10;
}
#lightbox-container-image-box > #lightbox-nav { left: 0; }
#lightbox-nav a { outline: none;}
#lightbox-nav-btnPrev, #lightbox-nav-btnNext {
width: 49%;
height: 100%;
zoom: 1;
display: block;
}
#lightbox-nav-btnPrev {
left: 0;
float: left;
}
#lightbox-nav-btnNext {
right: 0;
float: right;
}
#lightbox-container-image-data-box {
font: 10px Verdana, Helvetica, sans-serif;
background-color: #fff;
margin: 0 auto;
line-height: 1.4em;
overflow: auto;
width: 100%;
padding: 0 10px 0;
}
#lightbox-container-image-data {
padding: 0 10px;
color: #666;
}
#lightbox-container-image-data #lightbox-image-details {
width: 70%;
float: left;
text-align: left;
}
#lightbox-image-details-caption { font-weight: bold; }
#lightbox-image-details-currentNumber {
display: block;
clear: left;
padding-bottom: 1.0em;
}
#lightbox-secNav-btnClose {
width: 66px;
float: right;
padding-bottom: 0.7em;
}

Date : 2010-08-20 13:35:35

By : เด็กหมุย

No. 4

Guest

ต้องไปตั้งค่าตรงไหนป่าวครับ อีกอย่างผมต้องการให้ แสดงเฉพาะ ไฟล์ที่ค้นหา ครับ

เช่นผมต้องการ หาภาพ MAJ0302IIN_C แต่มันโชว์ภาพทั้งหมดเลยครับ

Date : 2013-10-10 16:11:33

By : injestic

ค้นหาข้อมูล

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

Re : อยากใช้ php ดึงรูปภาพ จากโฟลเดอร์ มาแสดง พร้อม เทคนิค แบ่งหน้าพร้อมเรียงรูปตามรายชื่อ

รายละเอียด

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

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

Notice

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

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

โดย

อีเมล์

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