이미지 갤러리 (직)제작 소스 정보
이미지 갤러리 (직)제작 소스본문
/* 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"> </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
2
댓글 0개