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

HOME > PHP > PHP Forum > จะเขียนแบ่งข้อมุลยังไงให้ มันแบ่ง ตาม <div > ของ คลาสที่เราเขียนไว้ให้ slide div ครับ


[PHP] จะเขียนแบ่งข้อมุลยังไงให้ มันแบ่ง ตาม <div > ของ คลาสที่เราเขียนไว้ให้ slide div ครับ

 
Topic : 074192



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

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

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



ผมดึงข้อมูลจาก ด้าต้าเบสทั้งหมด

แล้วจะเอามาแบ่ง ใน div ครับ ให้แสดงตามจำรวนที่ต้องการ แล้วถ้ามีมากกว่านั้น ก็ให้ขึ้นฟั้งชั่น ของ div ใหม่ครับ

<div class="slide" >
ตรงนี้ ผมต้องการโชว์ แบบ 3x2 ครับ
</div>



Tag : PHP, MySQL
Move To Hilight (Stock) 
Send To Friend.Bookmark.
Date : 2012-02-20 14:30:44 By : ddsiam View : 969 Reply : 6
 

 

No. 1



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

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

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

view source
print?
01.<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml2/DTD/xhtml1-strict.dtd">
02.<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
03.<head>
04.<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
05.<meta http-equiv="Content-Language" content="en-us" />
06.<title>5 column CSS Layout</title>
07.<style type="text/css">
08.html, body {
09.height: 100%
10.font: normal normal arial,helevtica,verdana,sans-serif;
11.color: #000;
12.}
13.#container {
14.height: 100%;
15.padding: 5px;
16.background: #CCC;
17.}
18.#col_one {
19.margin: 0; /* Applied to first column only in lieu of padding (personal thing) */
20.width: 18%; /* Allows for fluid design. Can be set to pixels */
21.float: left;
22.background: #cff; /* Only here so you can see the different columns */
23.border: thin solid #000; /* again, just so you can see the different columns */
24.}
25.#col_two {
26.margin: 0 0 0 10px; /* Puts a 10 pixel space between columns (left side) - think cellspacing */
27.width: 18%;
28.float: left;
29.background: #6cf; /* Only here so you can see the different columns */
30.border: thin solid #000; /* again, just so you can see the different columns */
31.}
32.#col_three {
33.margin: 0 0 0 10px; /* Puts a 10 pixel space between columns (left side) - think cellspacing */
34.width: 18%;
35.float: left;
36.background: #3cf; /* Only here so you can see the different columns */
37.border: thin solid #000; /* again, just so you can see the different columns */
38.}
39.#col_four {
40.margin: 0 0 0 10px; /* Puts a 10 pixel space between columns (left side) - think cellspacing */
41.width: 18%;
42.float: left;
43.background: #0cf; /* Only here so you can see the different columns */
44.border: thin solid #000; /* again, just so you can see the different columns */
45.}
46.#col_five {
47.margin: 0 0 0 10px; /* Puts a 10 pixel space between columns (left side) - think cellspacing */
48.width: 18%;
49.float: left;
50.background: #09c; /* Only here so you can see the different columns */
51.border: thin solid #000; /* again, just so you can see the different columns */
52.}
53./* Note: adding larger margins or padding to columns requires that you decrease the width setting proportionally,
54.that is why the width is currently set to 18%. If you add padding to the container, the same applies. */
55.</style>
56.</head>
57. 
58.<body>
59.<div id="container">
60.<div id="col_one">column One column One column One column One column One column One column One column One column One column One column One column One</div>
61.<div id="col_two">column Two column Two column Two column Two column Two column Two column Two column Two</div>
62.<div id="col_three">column Three column Three column Three column Three column Three column Three column Three column Three column Three column Three</div>
63.<div id="col_four">Colimn Four column Four column Four column Four column Four column Four column Four column Four column Four column Four column Four column Four column Four column Four column Four column Four column Four</div>
64.<div id="col_five">column Five column Five column Five column Five column Five column Five column Five column Five column Five column Five column Five column Five column Five column Five column Five column Five column Five column Five column Five column Five column Five column Five column Five column Five</div>
65.<br style="clear: both;" /> <!-- Included to force the container to wrap the columns -->
66. 
67.</div>
68.</body>
69. 
70.</html>

แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2012-02-21 05:53:34 By : webmaster
 

 

No. 2



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

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

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

view source
print?
01.<style>
02.#inline1{
03.    border:1px solid black;
04.    position:relative;
05.    background:#ccf;
06.    height:2em;
07.}
08..absembed {
09.    width:25%;
10.    position:absolute;
11.}
12.#embed2{
13.    top:0px;
14.    left:25%;
15.    background:#fcc;
16.}
17.#embed3{
18.    top:0px;
19.    left:50%;
20.    background:#ffc;
21.}
22.#embed4{
23.    top:0px;
24.    right:0px;
25.    background:#cff;
26.}
27.</style>
28.<div id="inline1">
29.    <div id="embed1" class="absembed">embed1</div>
30.    <div id="embed2" class="absembed">embed2</div>
31.    <div id="embed3" class="absembed">embed3</div>
32.    <div id="embed4" class="absembed">embed4</div>
33.</div>
34.<div id="inline1">
35.    <div id="embed1" class="absembed">embed1</div>
36.    <div id="embed2" class="absembed">embed2</div>
37.    <div id="embed3" class="absembed">embed3</div>
38.    <div id="embed4" class="absembed">embed4</div>
39.</div>


http://www.onlinetools.org/articles/css_columns.html
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2012-02-21 05:54:25 By : webmaster
 

 

No. 3



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

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

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


Code (PHP)
view source
print?
001.<html>
002.<head>
003.<title></title>
004.<script src="js/jquery-1.4.2.min.js" type="text/javascript"></script>
005.<script src="js/jquery.divslideshow-1.2-min.js" type="text/javascript"></script>
006. 
007.<script>
008.$(document).ready(function(){
009.    //make several slideshows with class selector, all slideshows shares the same parameters
010.    $('.slideshow').divSlideShow();    
011.     
012.    //make one slideshow with id selector
013.    $('#dss,#plug-and-play').divSlideShow({
014.    height:350,
015.        width:850,
016.        arrow:"split",
017.        loop:3,
018.        slideContainerClass:"slide-container",
019.        separatorClass:"separator",
020.        controlClass:"control", 
021.        leftArrowClass:"control",
022.        rightArrowClass:"control",
023.        controlActiveClass:"control-active",
024.        controlHoverClass:"control-hover",
025.        controlContainerClass:"control-container"
026.         
027.    });
028.     
029.    /*
030.    Updates:
031.        1.2 - some core functions have been rewritten
032.            - slideshows can now be manipulated by custom controls (can be outside the slideshow) by using the function: $.divSlideShow.slideTo(slideShow, page)
033.                - slideShow: a DOM object or a jquery-style selector string, e.g. '#slideshow'
034.                - page: the target page, from 0 to (maxPage - 1)
035.        1.1 - children no longer need to have the class "slide", all immediate children will become a slide (i.e. go down one level in the DOM tree)
036.            - removed all default css classes
037.            - renamed parameter: innerClass to slideContainerClass
038.            - added parameters: controlHoverClass, controlContainerClass   
039.     
040.    Requirments:
041.        jquery-1.4.2
042.     
043.    Paremeters [default]:
044.        width   [200] - width of contents
045.        height  [100] - height of contents (exclude controls, which adds extra height below the contents)
046.        arrow   ["begin"] - position of the left/right arrow ("begin" or "end" or "split")
047.        loop    [1] - number of loops of slideshow, set to 0 to disable slideshow
048.        delay   [5000] - time interval for slideshow, in milliseconds
049.         
050.        leftArrowClass          [""] - css class for left arrow
051.        rightArrowClass         [""] - css class for right arrow
052.        slideContainerClass     [""] - css class for contents container
053.        controlClass            [""] - css class for control buttons
054.        controlActiveClass      [""] - css class for active control buttons
055.        controlHoverClass       [""] - css class for mouse-hovered control buttons
056.        controlContainerClass   [""] - css class for the control button container
057.        separatorClass          [""] - css class for separator between contents and control buttons
058.    */
059.});
060. 
061.function manipulate()
062.{
063.    $.divSlideShow.slideTo('#plug-and-play',$('#test_gotoPage').val()-1);
064.}
065.</script>
066.<style>
067. 
068. 
069.#plug-and-play {display:none; margin-bottom:20px; border:0px solid #aaaaaa;}
070.#plug-and-play .slide{cursor:pointer;font-size:12px;font-family:Tahoma;border:0px solid #cccccc; margin:5px; padding:5px;}
071.#plug-and-play .slide-container{}
072.#plug-and-play .separator{border:0px solid #aaaaaa;}
073.#plug-and-play .control{font-size:10px; width:12px; cursor:pointer;}
074.#plug-and-play .control-container{background:#bbbbbb;}
075.#plug-and-play .control-active{text-decoration:none;}
076.#plug-and-play .control-hover{text-decoration:none; font-weight:bold;}
077. 
078.#dss {display:none;border:0px solid black;}
079.#dss .slide{cursor:pointer;font-size:12px;font-family:Tahoma;border:0px solid red; margin:5px; padding:5px;}
080.#dss .slide-container{}
081.#dss .separator{border:0px solid #22cc22;}
082.#dss .control{font-size:10px; width:12px; cursor:pointer;}
083.#dss .control-container{}
084.#dss .control-active{text-decoration:none;}
085.#dss .control-hover{text-decoration:none; font-weight:bold;}
086.a:link {
087.    text-decoration: none;
088.}
089.a:visited {
090.    text-decoration: none;
091.}
092.a:hover {
093.    text-decoration: none;
094.}
095.a:active {
096.    text-decoration: none;
097.}
098.</style>
099. 
100.<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"></head>
101.<body>
102. 
103. <div id="dss" >
104.     
105.    <div class="slide">
106.        <table border="0" cellspacing="0" cellpadding="0">
107.                                                       <tr>
108.                                                         <td>
109.                                                          
110.                                                          
111.                         
112.                         
113.                                                         <?
114.                                 
115.                                 include("inc/connect.php");
116.                                 
117.     
118.    $result=mysql_query("select * from tbl_tour where tourid='2'  ");
119.    $nf = mysql_num_fields($result);
120.    $num_rows = mysql_num_rows($result);
121.                                  if($num_rows =='0'){
122. 
123.                            echo  " No Data";
124.                        }else {
125.                        $dataIndb = $num_rows;
126.    $rowFix = $dataIndb/3;
127.    $rowFix = ceil($rowFix);
128.    //echo "<table width=\"100%\" border=0 cellpadding=0 cellspacing=0>";
129.    $count=0;
130.    for($i=0; $i<$rowFix; $i++){
131.    echo "<tr>";
132.        for($j=0; $j<3; $j++){
133.             
134.            echo "<td align=center>";
135.            if($count<$dataIndb){
136.                @mysql_data_seek($result,$count);
137.                $r = mysql_fetch_array($result);
138. 
139. 
140.                                  ?>
141.                                                             <table border="0" cellspacing="0" cellpadding="0">
142.                                                               <tr>
143.                                                                 <td><table width="260" height="150"  border="0" cellpadding="0" cellspacing="0">
144.                                                                     <tr>
145.                                                                       <td><a href="tours_view.php?topic_id=<?php echo  $r[topic_id]?>&tourid=<?php echo $r[tourid]?>" target="_parent"><img src="imgs_tour/<? echo $r[t_pic]; ?>"    /></a></td>
146.                                                                   </tr>
147.                                                                    
148.                                                                 </table></td>
149.                                                               </tr>
150.                                                             </table>
151.                                                           <? 
152.                                  }
153.        echo "</td>";
154.            $count++;
155.        }
156.        echo "</tr>";
157.        }
158.    }
159. 
160.                                   
161.                                  ?></td>
162.                                                       </tr>
163.                                                   </table>
164.     
165.    </div>
166.     
167.    
168.</div>
169. 
170. 
171. 
172.</body>
173.</html>


คือผมต้องการโชว์ ใน <div class="slide"> แค่ที่ละ 10 รูป ถ้าเราคิวรีมามากกว่า 10 ตัวที่ 11 ให้ขึ้น <div class="slide"> ใหม่ครับ
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2012-02-23 03:42:06 By : ddsiam
 

 

No. 4



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

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

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


http://www.kevinresol.com/divslideshow/example.php

ที่มาของโคต slide div ครับ
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2012-02-23 03:43:33 By : ddsiam
 

 

No. 5



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

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

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

Code (PHP)
view source
print?
1.if($count%10)==0)
2.{
3. echo "<div class=\"slide\">";
4.}
5.else
6.{
7.  echo "<div class=\"slide\">";
8.}
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2012-02-23 05:59:19 By : webmaster
 

 

No. 6



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

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

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


มัน errore

Parse error: syntax error, unexpected T_IS_EQUAL in C:\AppServ\www\bcc\index.php on line 506

line 506 >> if($count%10)=='0'){
แสดงความคิดเห็นโดยอ้างถึง ความคิดเห็นนี้
Date : 2012-02-23 07:24:19 By : ddsiam
 

   

ค้นหาข้อมูล
   
 

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





ThaiCreate.Com Logo
© www.ThaiCreate.Com. 2003-2025 All Rights Reserved.
ไทยครีเอทบริการ จัดทำดูแลแก้ไข Web Application ทุกรูปแบบ (PHP, .Net Application, VB.Net, C#)
[Conditions Privacy Statement] ติดต่อโฆษณา 081-987-6107 อัตราราคา คลิกที่นี่