이미지 갤러리 (직)제작 소스

    /* view s */
    .carView_t { width:100%; height:500px; display:inline-block; margin-top:20px; } 
    .carView_t li { float:left; text-align:left; }
    .carView_t_l { width:63%; }
    .carView_t_c { width:2%; }
    .carView_t_r { width:35%; }
    .carView_timgs { height:530px; }
    .carView_timgs img { width:100%; height:530px; border-radius:20px; position:relative; }
    .carView_title {
        text-align:left; color:#222; margin-top:20px; 
        position: relative; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; 
        font-size:24px; font-family:'SpoqaHanSansNeo_Medium'; letter-spacing: 0.01em; line-height:1em;     
    }
    .carView_stitle {
        text-align:left; color:#6b7486;  margin-top:15px; 
        position: relative; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; 
        font-size:20px; font-family:'SpoqaHanSansNeo_Medium'; letter-spacing: 0.01em; line-height:1em;     
    }
    .carView_t_simg { margin-top:30px; }
    .carView_t_simg_dd { float:left; width:25%; }
    .carView_t_simg_dd div { margin:3px; }
    .carView_t_simg_dd div img { width:100%; height:70px; cursor:pointer; }
    .carView_t_simg_dd div img:hover { transform:scale(1.06); transition: 0.3s; }

    .carView_timg_navi { position:relative; top:-280px; }
    .carView_timg_navi_l { position:absolute; left:10px; }
    .carView_timg_navi_r { position:absolute; right:10px; }
    /* view e */

/* 이미지 체인지 s */
function carView_tImgScript(t, x){
    var fname="carView_timg_form";
    var f=document[fname];    
    jQuery("#carView_timg").attr("src", t); 
    f.x.value=""+x;
}

function carView_timg_naviScript(p){
    var fname="carView_timg_form";
    var f=document[fname];    
    var x=f.x.value;
    var str1 = f.all.value;  
    var str2 = str1.split('|'); 
    var Xlength=str2.length-1;
    var xp="1";
    
    if(p=="1"){ 
        if(x==1){ xp=Xlength; }else{ xp=eval(x)-eval(1); }
    }else{
        if(x==Xlength){ xp=1; }else{ xp=eval(x)+eval(1); }
    }

    for(var idx=0; idx<=str2.length; idx++) 
    { 
        if(str2[idx]){ 
            if(eval(xp)-eval(1)==idx){ 
                jQuery("#carView_timg").attr("src", f.imgurl.value+"/"+str2[idx]); 
            }
        } // if(str2[idx]){  end
    }  // for end

    f.x.value=""+xp;

}
/* 이미지 체인지 e */

<div class="carView_t">
    <ul>
        <li class="carView_t_l">
            <div class="carView_timgs" id="carView_timgDiv">
                <?php
                    if($upfiles[0]){ if(is_file($CONFIG_MLANGSOFT_DATE_CAR_DIR."/".$wdateCut."/".$upfiles[0])){
                        $carView_timg_one=$CONFIG_MLANGSOFT_DATE_CAR_URL."/".$wdateCut."/".$upfiles[0];
                        echo "<img src='".$CONFIG_MLANGSOFT_DATE_CAR_URL."/".$wdateCut."/".$upfiles[0]."' id='carView_timg'>";
                    } }
                ?>
            </div>
            <form name="carView_timg_form">
                <input type="" name="imgurl" value="<?php echo $CONFIG_MLANGSOFT_DATE_CAR_URL."/".$wdateCut; ?>">
                <input type="" name="x" value="1">
                <input type="" name="all" value="<?php echo $upfile;?>">
            </form>
            <div class="carView_timg_navi">
                <div class="carView_timg_navi_l carTopMenubtbBox" onclick="javascript:carView_timg_naviScript('1');"><img src="/Mlang/img/sicon_1.png"></div>
                <div class="carView_timg_navi_r carTopMenubtbBox" onclick="javascript:carView_timg_naviScript('2');"><img src="/Mlang/img/sicon_2.png"></div>
            </div>
        </li>
        <li class="carView_t_c">&nbsp;</li>
        <li class="carView_t_r">
            <div class="carView_title"><?php echo htmlspecialchars($row['title']); ?></div>
            <?php if(htmlspecialchars($row['stitle'])){ ?><div class="carView_stitle"><?php echo htmlspecialchars($row['stitle']); ?></div><?php } ?>
            <div class='carView_t_simg'>
                <dl>
                <?php
                    $upfilesCount=count($upfiles)-1; if($upfilesCount<=16){ $upfilesCounts=$upfilesCount; }else{ $upfilesCounts=16; }
                    for($k=0; $k<=$upfilesCounts; $k++){ 
                        if($upfiles[$k]){ if(is_file($CONFIG_MLANGSOFT_DATE_CAR_DIR."/".$wdateCut."/".$upfiles[$k])){
                            $kc=$k+1;
                            echo "<dd class='carView_t_simg_dd'><div onclick=\"javascript:carView_tImgScript('".$CONFIG_MLANGSOFT_DATE_CAR_URL."/".$wdateCut."/".$upfiles[$k]."','".$kc."');\"><img src='".$CONFIG_MLANGSOFT_DATE_CAR_URL."/".$wdateCut."/".$upfiles[$k]."'></div></dd>";
                        } }
                    }
                ?>
                </dl>
            </div>
        </li>
    </ul>
</div>
 

궁금사항이나 프로그램 제작 희망하시는분은 

※ 연락처: 010-5005-육102 
※ 텔레그램: @sky1014