Menampilkan gambar(Foto)

Sutio Bangkit Gultom · Feb 6, 2014
Permisi Mas Ellyx,Saya mau nanya ni buat mas Ellyx..
saya punya template slh satu pagenya menampilkan foto, ini htmlnya
<section id="content">
    	<div class="page3-row1 pad-2 tabs">
<!----------------------------------------------Categories------------------------------------------------------------------------------>
        	<div class="col-8">
            	<h2 class="h2 p2">Categories:</h2>
                <ul class="list-1 nav">
                	<li class="selected"><a href="#tab-1">Fashion</a></li>
                    <li><a href="#tab-2">Animals</a></li>
                    <li><a href="#tab-3">Wedding</a></li>
                    <li><a href="#tab-4">Sport</a></li>
                    <li><a href="#tab-5">Portrait</a></li>
                </ul>
            </div>
<!----------------------------------------------Gambar-------------------------------------------------------------------------------->
            <div class="col-9">
            	<h3 class="h3-2">Fashion:</h3>
                <div id="tab-1" class="tab-content gallery-photo">
                   <div class="inner">
                        <ul id="mycarousel-1" class="jcarousel-skin-tango">
                            <li><a class="plus"     href="images/portfolio-1-big.jpg"><img src="images/portfolio-1.jpg" alt=""></a>
								<a class="plus"     href="images/portfolio-2-big.jpg"><img src="images/portfolio-2.jpg" alt=""></a>
								<a class="plus"     href="images/portfolio-3-big.jpg"><img src="images/portfolio-3.jpg" alt=""></a>
								<a class="plus"     href="images/portfolio-4-big.jpg"><img src="images/portfolio-4.jpg" alt=""></a>
							</li>
                            <li><a class="plus"     href="images/portfolio-5-big.jpg"><img src="images/portfolio-5.jpg" alt=""></a>
								<a class="plus"     href="images/portfolio-6-big.jpg"><img src="images/portfolio-6.jpg" alt=""></a>
								<a class="plus"     href="images/portfolio-7-big.jpg"><img src="images/portfolio-7.jpg" alt=""></a>
								<a class="plus"     href="images/portfolio-8-big.jpg"><img src="images/portfolio-8.jpg" alt=""></a>
							</li>
                            <li><a class="plus"     href="images/portfolio-9-big.jpg"><img src="images/portfolio-9.jpg" alt=""></a>
								<a class="plus"     href="images/portfolio-10-big.jpg"><img src="images/portfolio-10.jpg" alt=""></a>
								<a class="plus"     href="images/portfolio-11-big.jpg"><img src="images/portfolio-11.jpg" alt=""></a>
								<a class="plus"     href="images/portfolio-1-big.jpg"><img src="images/portfolio-1.jpg" alt=""></a>
							</li>
                            <li><a class="plus"     href="images/portfolio-12-big.jpg"><img src="images/portfolio-12.jpg" alt=""></a>
								<a class="plus"     href="images/portfolio-13-big.jpg"><img src="images/portfolio-13.jpg" alt=""></a>
								<a class="plus"     href="images/portfolio-14-big.jpg"><img src="images/portfolio-14.jpg" alt=""></a>
								<a class="plus"     href="images/portfolio-2-big.jpg"><img src="images/portfolio-2.jpg" alt=""></a>
							</li>
                        </ul>
                    </div>
                </div>
<!------------------------------------------------------------------------------------------------------------------------------>
                <div id="tab-2" class="tab-content gallery-photo">
                   <div class="inner">
                        <ul id="mycarousel-2" class="jcarousel-skin-tango">
                            <li><a class="plus"     href="images/portfolio-9-big.jpg"><img src="images/portfolio-9.jpg" alt=""></a>
								<a class="plus"     href="images/portfolio-10-big.jpg"><img src="images/portfolio-10.jpg" alt=""></a>
								<a class="plus"     href="images/portfolio-11-big.jpg"><img src="images/portfolio-11.jpg" alt=""></a>
								<a class="plus"     href="images/portfolio-1-big.jpg"><img src="images/portfolio-1.jpg" alt=""></a>
							</li>
                            <li><a class="plus"     href="images/portfolio-12-big.jpg"><img src="images/portfolio-12.jpg" alt=""></a>
								<a class="plus"     href="images/portfolio-13-big.jpg"><img src="images/portfolio-13.jpg" alt=""></a>
								<a class="plus"     href="images/portfolio-14-big.jpg"><img src="images/portfolio-14.jpg" alt=""></a>
								<a class="plus"     href="images/portfolio-2-big.jpg"><img src="images/portfolio-2.jpg" alt=""></a>
							</li>
                            <li><a class="plus"     href="images/portfolio-1-big.jpg"><img src="images/portfolio-1.jpg" alt=""></a>
								<a class="plus"     href="images/portfolio-2-big.jpg"><img src="images/portfolio-2.jpg" alt=""></a>
								<a class="plus"     href="images/portfolio-3-big.jpg"><img src="images/portfolio-3.jpg" alt=""></a>
								<a class="plus"     href="images/portfolio-4-big.jpg"><img src="images/portfolio-4.jpg" alt=""></a>
							</li>
                            <li><a class="plus"     href="images/portfolio-5-big.jpg"><img src="images/portfolio-5.jpg" alt=""></a>
								<a class="plus"     href="images/portfolio-6-big.jpg"><img src="images/portfolio-6.jpg" alt=""></a>
								<a class="plus"     href="images/portfolio-7-big.jpg"><img src="images/portfolio-7.jpg" alt=""></a>
								<a class="plus"     href="images/portfolio-8-big.jpg"><img src="images/portfolio-8.jpg" alt=""></a>
							</li>
                        </ul>
                    </div>
                </div>
<!------------------------------------------------------------------------------------------------------------------------------>
                <div id="tab-3" class="tab-content gallery-photo">
                   <div class="inner">
                        <ul id="mycarousel-3" class="jcarousel-skin-tango">
                        	<li><a class="plus"     href="images/portfolio-5-big.jpg"><img src="images/portfolio-5.jpg" alt=""></a>
								<a class="plus"     href="images/portfolio-6-big.jpg"><img src="images/portfolio-6.jpg" alt=""></a>
								<a class="plus"     href="images/portfolio-7-big.jpg"><img src="images/portfolio-7.jpg" alt=""></a>
								<a class="plus"     href="images/portfolio-8-big.jpg"><img src="images/portfolio-8.jpg" alt=""></a>
							</li>
                            <li><a class="plus"     href="images/portfolio-9-big.jpg"><img src="images/portfolio-9.jpg" alt=""></a>
								<a class="plus"     href="images/portfolio-10-big.jpg"><img src="images/portfolio-10.jpg" alt=""></a>
								<a class="plus"     href="images/portfolio-11-big.jpg"><img src="images/portfolio-11.jpg" alt=""></a>
								<a class="plus"     href="images/portfolio-1-big.jpg"><img src="images/portfolio-1.jpg" alt=""></a>
							</li>
                        	 <li><a class="plus"     href="images/portfolio-1-big.jpg"><img src="images/portfolio-1.jpg" alt=""></a>
								 <a class="plus"     href="images/portfolio-2-big.jpg"><img src="images/portfolio-2.jpg" alt=""></a>
								 <a class="plus"     href="images/portfolio-3-big.jpg"><img src="images/portfolio-3.jpg" alt=""></a>
								 <a class="plus"     href="images/portfolio-4-big.jpg"><img src="images/portfolio-4.jpg" alt=""></a>
							 </li>
                            <li><a class="plus"     href="images/portfolio-12-big.jpg"><img src="images/portfolio-12.jpg" alt=""></a>
								<a class="plus"     href="images/portfolio-13-big.jpg"><img src="images/portfolio-13.jpg" alt=""></a>
								<a class="plus"     href="images/portfolio-14-big.jpg"><img src="images/portfolio-14.jpg" alt=""></a>
								<a class="plus"     href="images/portfolio-2-big.jpg"><img src="images/portfolio-2.jpg" alt=""></a>
							</li>
                        </ul>
                    </div>
                </div>
 
<!------------------------------------------------------------------------------------------------------------------------------>
                
            </div>      
        </div>
    </section>
Jika diklik kategorinya muncullah gamnbar disamping kanan sesuai kategori(jika menggunakan html diatas jalan)
<li><a href="#tab-2">Animals</a></li> dan <div id="tab-2" class="tab-content gallery-photo">
<ul id="mycarousel-2" class="jcarousel-skin-tango">
Yg saya bold diatas harus sama mas,,hrs sama 2,atau 3,dst supaya JQuerynya jalan..
Nah,, saya mau buat spaya dinamis foto dan kategorinya dr database..
Jadilah begini
<section id="content">
    	<div class="page3-row1 pad-2 tabs">
        	<div class="col-8">
            	<h2 class="h2 p2">Categories:</h2>
                <ul class="list-1 nav">
				<?php
				include "config/koneksi.php";
				$no=1;
				$sql=mysql_query("select * from kp order by id_kp asc");
				while($rc=mysql_fetch_array($sql)){
				$id=$rc['id_kp'];
				?>
				<li><a href="#tab-<?php echo $no; ?>"><?php  echo $rc['nama_kp']; ?></a></li>
				<?php
					$no++;
					}
				?>
                </ul>
            </div>
            <div class="col-9">
            	<h3 class="h3-2">Fashion:</h3>
				                            <?php 
											$no=1;
											$jlh_kategori=mysql_num_rows(mysql_query("select * from kp"));
											$sp=mysql_query("select * from portfolio  order by id_kp asc");
 
								while($rsp=mysql_fetch_array($sp)){ 
											$g=$rsp["gambar_p"];	
											?>
                <div id="tab-<?php echo $no; ?>" class="tab-content gallery-photo">
                   <div class="inner">
                        <ul id="mycarousel-<?php echo $no; ?>" class="jcarousel-skin-tango">
						<li><?php 		for($no;$no<=4;$no++){	?>
							<a class="plus"     href="images/portfolio/<?php echo $g; ?>"><img src="images/portfolio/<?php echo "small-$g";  ?>" alt=""></a>
									
							<?php }	if($no % 4 ==0){
										echo "</li><li>";		}	
								?>
							</li>
                        </ul>
                    </div>
                </div>
				<?php		$no++;	
						}		?>
              
                
            </div>      
        </div>
    </section>
Jika menggunakan scrip php diatas,kategorinya muncul,Masalahnya gambar yg tampil hanya di kategoti pertama saja, itu pun gambarnya ada 4 dan sama , padahal dikategori itu ada beberapa gambar,
Tolong ya Mas Ellyx...dan juga master2 php lainnya..
Terima kasih sebelumnya..GBU
Silahkan login untuk menjawab!