본문이미지 쇼핑몰처럼돌리자

· 19년 전 · 3505 · 1
안녕하세요 짜집퍼입니다....
이번것은 많이들 질문하시는것 같으네요....

아래소스는 0-3까지 업로드된 파일중에서 이미지인 경우
큰이미지를 5초에한번씩 바꿔주고 큰이미지를 클릭하면 원본이미지를 보여주고
작은사이즈를 리스트에 나타내어 작은 그림을 클릭하면 큰이미지창에 보여줘라입니다....

한가지 문제는 그림파일이 아닐때에 나타나지 않는것은 좋으나,
그림파일이 아닐때에 건너뛰지못하고 5초화면동안 무이미지로 표시된다는것입니다....
소스를 좀만추가하면 될것같은데 고수님들이 소스를 붙여주는 센스를 기대합니다......

* 다른소스 못짜드립니다 * 이유: 짜집퍼...ㅎㅎ



소스올립니다.



<SCRIPT language=javascript>
var currentItem = '1';
var rotateTimmer;
var isStop = '0';
</SCRIPT>

<TABLE onmouseover="isStop='1'" onmouseout="isStop='0'" cellSpacing=0
cellPadding=0 width=400 border=1>
<TBODY>
<TR>
<TD width=400 height=400>
<DIV id="oTransContainer"
style="width:400px; height:400px; position:absolute; left:0px; top:0px; z-index:1; FILTER: progid:DXImageTransform.Microsoft.Iris(irisStyle='CIRCLE', motion='out', duration=0.6);"><!-- ITEM 1 -->


<DIV id="oDIV1" style="width:400px; height:400px; position:absolute; left:0px; top:0px; z-index:1; visibility:visible;">






<?
// 파일 출력
for($i=0; $i<=count($view[file]); $i++) {
if($view[file][$i][view])
###############################################
$img_width=100;
$f_type=""; $f_style=""; $f_path=""; $f_file ="";
// echo"파일타입: {$view[file][$i][image_type]}<br>";
$f_type=$view[file][$i][image_type];
if($f_type=='1' || $f_type=='2' || $f_type=='3' ||$f_type=='6' || $f_type=='7') $f_style="img";
else if($f_type=='4') $f_style="movie_img";//쭉..형태추가
else if($f_type=='0') $f_style="file_link";
$f_file = urlencode($view[file][$i][file]);
$f_path="{$view[file][$i][path]}";

###############################################
// if($view[file][$i][source])

if($view[file][$i][source] && $i==0) // 이미지출력변수
{$view[file][$i][href]="$f_path/$f_file";
// $image[$i] = "$g4[path]/data/file/$bo_table/".$view[file][$i][file];

$image[$i] = "$g4[path]/data/file/$bo_table/".$view[file][$i][file];
if(preg_match("/\.(jp[e]?g|tif|bmp|gif|png)$/i","$f_file")
&& file_exists("$f_path/$f_file")&& $f_style=="img")
{//이미지면 끝

// echo"<a href='{$view[file][$i][href]}'><img src='$f_path/$f_file' width='$img_width' border='0'><br>";
//echo"<a href=$image[$i]><img src='$f_path/$f_file' width='$img_width' border='0'><br>";
//echo"<a href=# onclick=image_window('$image[$i]') style='cursor:pointer'><img src='$f_path/$f_file' width='$img_width' border='0'><br>";
//echo"<a href=# onclick=images_window('$image[$i]') style='cursor:pointer'><img src='$f_path/$f_file' width='300' height=300 border='1'><br>";

echo"<img src='$f_path/$f_file' width='300' height=300 border='1' onclick=image_window('$image[$i]') style='cursor:pointer'>";
echo"<br>";

// echo"</a><br>";
echo"이미지크기:<font color='red'>{$view[file][$i][image_width]} x {$view[file][$i][image_height]}</font><br>";
echo"이미지설명:<font color='blue'>{$view[file][$i][bf_content]}</font><br>";
echo"<br>";
}else
echo $view[file][$i][view];
}//if 다운소스가 존재하면
###############################################
}//for 끝
?>


















</DIV><!-- ITEM 2 -->
<DIV id="oDIV2"
style="width:400px; height:400px; position:absolute; left:0px; top:0px; z-index:1; visibility:hidden;">







<?
// 파일 출력
for($i=0; $i<=count($view[file]); $i++) {
if($view[file][$i][view])
###############################################
$img_width=100;
$f_type=""; $f_style=""; $f_path=""; $f_file ="";
// echo"파일타입: {$view[file][$i][image_type]}<br>";
$f_type=$view[file][$i][image_type];
if($f_type=='1' || $f_type=='2' || $f_type=='3' ||$f_type=='6' || $f_type=='7') $f_style="img";
else if($f_type=='4') $f_style="movie_img";//쭉..형태추가
else if($f_type=='0') $f_style="file_link";
$f_file = urlencode($view[file][$i][file]);
$f_path="{$view[file][$i][path]}";

###############################################
// if($view[file][$i][source])

if($view[file][$i][source] && $i==1) // 이미지출력변수
{$view[file][$i][href]="$f_path/$f_file";
// $image[$i] = "$g4[path]/data/file/$bo_table/".$view[file][$i][file];

$image[$i] = "$g4[path]/data/file/$bo_table/".$view[file][$i][file];
if(preg_match("/\.(jp[e]?g|tif|bmp|gif|png)$/i","$f_file")
&& file_exists("$f_path/$f_file")&& $f_style=="img")
{//이미지면 끝

// echo"<a href='{$view[file][$i][href]}'><img src='$f_path/$f_file' width='$img_width' border='0'><br>";
//echo"<a href=$image[$i]><img src='$f_path/$f_file' width='$img_width' border='0'><br>";
//echo"<a href=# onclick=image_window('$image[$i]') style='cursor:pointer'><img src='$f_path/$f_file' width='$img_width' border='0'><br>";
//echo"<a href=# onclick=images_window('$image[$i]') style='cursor:pointer'><img src='$f_path/$f_file' width='300' height=300 border='1'><br>";

echo"<img src='$f_path/$f_file' width='300' height=300 border='1' onclick=image_window('$image[$i]') style='cursor:pointer'>";
echo"<br>";

// echo"</a><br>";
echo"이미지크기:<font color='red'>{$view[file][$i][image_width]} x {$view[file][$i][image_height]}</font><br>";
echo"이미지설명:<font color='blue'>{$view[file][$i][bf_content]}</font><br>";
echo"<br>";
}else
echo $view[file][$i][view];
}//if 다운소스가 존재하면
###############################################
}//for 끝
?>

















</DIV><!-- ITEM 3 -->
<DIV id="oDIV3"
style="width:373px; height:214px; position:absolute; left:0px; top:0px; z-index:1; visibility:hidden;">





<?
// 파일 출력
for($i=0; $i<=count($view[file]); $i++) {
if($view[file][$i][view])
###############################################
$img_width=100;
$f_type=""; $f_style=""; $f_path=""; $f_file ="";
// echo"파일타입: {$view[file][$i][image_type]}<br>";
$f_type=$view[file][$i][image_type];
if($f_type=='1' || $f_type=='2' || $f_type=='3' ||$f_type=='6' || $f_type=='7') $f_style="img";
else if($f_type=='4') $f_style="movie_img";//쭉..형태추가
else if($f_type=='0') $f_style="file_link";
$f_file = urlencode($view[file][$i][file]);
$f_path="{$view[file][$i][path]}";

###############################################
// if($view[file][$i][source])

if($view[file][$i][source] && $i==2) // 이미지출력변수
{$view[file][$i][href]="$f_path/$f_file";
// $image[$i] = "$g4[path]/data/file/$bo_table/".$view[file][$i][file];

$image[$i] = "$g4[path]/data/file/$bo_table/".$view[file][$i][file];
if(preg_match("/\.(jp[e]?g|tif|bmp|gif|png)$/i","$f_file")
&& file_exists("$f_path/$f_file")&& $f_style=="img")
{//이미지면 끝

// echo"<a href='{$view[file][$i][href]}'><img src='$f_path/$f_file' width='$img_width' border='0'><br>";
//echo"<a href=$image[$i]><img src='$f_path/$f_file' width='$img_width' border='0'><br>";
//echo"<a href=# onclick=image_window('$image[$i]') style='cursor:pointer'><img src='$f_path/$f_file' width='$img_width' border='0'><br>";
//echo"<a href=# onclick=images_window('$image[$i]') style='cursor:pointer'><img src='$f_path/$f_file' width='300' height=300 border='1'><br>";

echo"<img src='$f_path/$f_file' width='300' height=300 border='1' onclick=image_window('$image[$i]') style='cursor:pointer'>";
echo"<br>";

// echo"</a><br>";
echo"이미지크기:<font color='red'>{$view[file][$i][image_width]} x {$view[file][$i][image_height]}</font><br>";
echo"이미지설명:<font color='blue'>{$view[file][$i][bf_content]}</font><br>";
echo"<br>";
}else
echo $view[file][$i][view];
}//if 다운소스가 존재하면
###############################################
}//for 끝
?>







</DIV><!-- ITEM 4 -->
<DIV id="oDIV4"
style="width:373px; height:214px; position:absolute; left:0px; top:0px; z-index:1; visibility:hidden;">







<?
// 파일 출력
for($i=0; $i<=count($view[file]); $i++) {
if($view[file][$i][view])
###############################################
$img_width=100;
$f_type=""; $f_style=""; $f_path=""; $f_file ="";
// echo"파일타입: {$view[file][$i][image_type]}<br>";
$f_type=$view[file][$i][image_type];
if($f_type=='1' || $f_type=='2' || $f_type=='3' ||$f_type=='6' || $f_type=='7') $f_style="img";
else if($f_type=='4') $f_style="movie_img";//쭉..형태추가
else if($f_type=='0') $f_style="file_link";
$f_file = urlencode($view[file][$i][file]);
$f_path="{$view[file][$i][path]}";

###############################################
// if($view[file][$i][source])

if($view[file][$i][source] && $i==3) // 이미지출력변수
{$view[file][$i][href]="$f_path/$f_file";
// $image[$i] = "$g4[path]/data/file/$bo_table/".$view[file][$i][file];

$image[$i] = "$g4[path]/data/file/$bo_table/".$view[file][$i][file];
if(preg_match("/\.(jp[e]?g|tif|bmp|gif|png)$/i","$f_file")
&& file_exists("$f_path/$f_file")&& $f_style=="img")
{//이미지면 끝

// echo"<a href='{$view[file][$i][href]}'><img src='$f_path/$f_file' width='$img_width' border='0'><br>";
//echo"<a href=$image[$i]><img src='$f_path/$f_file' width='$img_width' border='0'><br>";
//echo"<a href=# onclick=image_window('$image[$i]') style='cursor:pointer'><img src='$f_path/$f_file' width='$img_width' border='0'><br>";
//echo"<a href=# onclick=images_window('$image[$i]') style='cursor:pointer'><img src='$f_path/$f_file' width='300' height=300 border='1'><br>";

echo"<img src='$f_path/$f_file' width='300' height=300 border='1' onclick=image_window('$image[$i]') style='cursor:pointer'>";
echo"<br>";

// echo"</a><br>";
echo"이미지크기:<font color='red'>{$view[file][$i][image_width]} x {$view[file][$i][image_height]}</font><br>";
echo"이미지설명:<font color='blue'>{$view[file][$i][bf_content]}</font><br>";
echo"<br>";
}else
echo $view[file][$i][view];
}//if 다운소스가 존재하면
###############################################
}//for 끝
?>












</DIV></DIV></TD></TR>

<TR>
<TD width=400 height=200>

<!-- <A href="javascript:swapItem(1,%20true)">111111111111</A><BR>
<A href="javascript:swapItem(2,%20true)">2222222222</A><BR>
<A href="javascript:swapItem(3,%20true)">3333333333333333333333</A><BR>
<A href="javascript:swapItem(4,%20true)">4444444444444444444444</A> -->




















<A href="javascript:swapItem(1,%20true)">






<?
// 파일 출력
for($i=0; $i<=count($view[file]); $i++) {
if($view[file][$i][view])
###############################################
$img_width=100;
$f_type=""; $f_style=""; $f_path=""; $f_file ="";
// echo"파일타입: {$view[file][$i][image_type]}<br>";
$f_type=$view[file][$i][image_type];
if($f_type=='1' || $f_type=='2' || $f_type=='3' ||$f_type=='6' || $f_type=='7') $f_style="img";
else if($f_type=='4') $f_style="movie_img";//쭉..형태추가
else if($f_type=='0') $f_style="file_link";
$f_file = urlencode($view[file][$i][file]);
$f_path="{$view[file][$i][path]}";

###############################################
// if($view[file][$i][source])

if($view[file][$i][source] && $i==0) // 이미지출력변수
{$view[file][$i][href]="$f_path/$f_file";
// $image[$i] = "$g4[path]/data/file/$bo_table/".$view[file][$i][file];

$image[$i] = "$g4[path]/data/file/$bo_table/".$view[file][$i][file];
if(preg_match("/\.(jp[e]?g|tif|bmp|gif|png)$/i","$f_file")
&& file_exists("$f_path/$f_file")&& $f_style=="img")
{//이미지면 끝

echo"<img src='$f_path/$f_file' width='50' height=50 border='1' >";
echo"<br>";
}else
echo $view[file][$i][view];
}//if 다운소스가 존재하면
###############################################
}//for 끝
?>







</A><BR>

<A href="javascript:swapItem(2,%20true)">






<?
// 파일 출력
for($i=0; $i<=count($view[file]); $i++) {
if($view[file][$i][view])
###############################################
$img_width=100;
$f_type=""; $f_style=""; $f_path=""; $f_file ="";
// echo"파일타입: {$view[file][$i][image_type]}<br>";
$f_type=$view[file][$i][image_type];
if($f_type=='1' || $f_type=='2' || $f_type=='3' ||$f_type=='6' || $f_type=='7') $f_style="img";
else if($f_type=='4') $f_style="movie_img";//쭉..형태추가
else if($f_type=='0') $f_style="file_link";
$f_file = urlencode($view[file][$i][file]);
$f_path="{$view[file][$i][path]}";

###############################################
// if($view[file][$i][source])

if($view[file][$i][source] && $i==1) // 이미지출력변수
{$view[file][$i][href]="$f_path/$f_file";
// $image[$i] = "$g4[path]/data/file/$bo_table/".$view[file][$i][file];

$image[$i] = "$g4[path]/data/file/$bo_table/".$view[file][$i][file];
if(preg_match("/\.(jp[e]?g|tif|bmp|gif|png)$/i","$f_file")
&& file_exists("$f_path/$f_file")&& $f_style=="img")
{//이미지면 끝

echo"<img src='$f_path/$f_file' width='50' height=50 border='1' >";
echo"<br>";
}else
echo $view[file][$i][view];
}//if 다운소스가 존재하면
###############################################
}//for 끝
?>









</A><BR>

<A href="javascript:swapItem(3,%20true)">





<?
// 파일 출력
for($i=0; $i<=count($view[file]); $i++) {
if($view[file][$i][view])
###############################################
$img_width=100;
$f_type=""; $f_style=""; $f_path=""; $f_file ="";
// echo"파일타입: {$view[file][$i][image_type]}<br>";
$f_type=$view[file][$i][image_type];
if($f_type=='1' || $f_type=='2' || $f_type=='3' ||$f_type=='6' || $f_type=='7') $f_style="img";
else if($f_type=='4') $f_style="movie_img";//쭉..형태추가
else if($f_type=='0') $f_style="file_link";
$f_file = urlencode($view[file][$i][file]);
$f_path="{$view[file][$i][path]}";

###############################################
// if($view[file][$i][source])

if($view[file][$i][source] && $i==2) // 이미지출력변수
{$view[file][$i][href]="$f_path/$f_file";
// $image[$i] = "$g4[path]/data/file/$bo_table/".$view[file][$i][file];

$image[$i] = "$g4[path]/data/file/$bo_table/".$view[file][$i][file];
if(preg_match("/\.(jp[e]?g|tif|bmp|gif|png)$/i","$f_file")
&& file_exists("$f_path/$f_file")&& $f_style=="img")
{//이미지면 끝

echo"<img src='$f_path/$f_file' width='50' height=50 border='1' >";
echo"<br>";
}else
echo $view[file][$i][view];
}//if 다운소스가 존재하면
###############################################
}//for 끝
?>






</A><BR>

<A href="javascript:swapItem(4,%20true)">





<?
// 파일 출력
for($i=0; $i<=count($view[file]); $i++) {
if($view[file][$i][view])
###############################################
$img_width=100;
$f_type=""; $f_style=""; $f_path=""; $f_file ="";
// echo"파일타입: {$view[file][$i][image_type]}<br>";
$f_type=$view[file][$i][image_type];
if($f_type=='1' || $f_type=='2' || $f_type=='3' ||$f_type=='6' || $f_type=='7') $f_style="img";
else if($f_type=='4') $f_style="movie_img";//쭉..형태추가
else if($f_type=='0') $f_style="file_link";
$f_file = urlencode($view[file][$i][file]);
$f_path="{$view[file][$i][path]}";

###############################################
// if($view[file][$i][source])

if($view[file][$i][source] && $i==3) // 이미지출력변수
{$view[file][$i][href]="$f_path/$f_file";
// $image[$i] = "$g4[path]/data/file/$bo_table/".$view[file][$i][file];

$image[$i] = "$g4[path]/data/file/$bo_table/".$view[file][$i][file];
if(preg_match("/\.(jp[e]?g|tif|bmp|gif|png)$/i","$f_file")
&& file_exists("$f_path/$f_file")&& $f_style=="img")
{//이미지면 끝

echo"<img src='$f_path/$f_file' width='50' height=50 border='1' >";
echo"<br>";
}else
echo $view[file][$i][view];
}//if 다운소스가 존재하면
###############################################
}//for 끝
?>









</A>


</TD></TR></TBODY></TABLE>



<SCRIPT language=javascript>
function swapItem(mode, clicked)
{
clearTimeout(rotateTimmer);

if(isStop == '1' && clicked != true)
{
rotateTimmer = setTimeout('swapItem('+mode+')', 5000);
return;
}

oTransContainer.filters[0].Apply();

oDIV1.style.visibility="hidden";
oDIV2.style.visibility="hidden";
oDIV3.style.visibility="hidden";
oDIV4.style.visibility="hidden";
eval("oDIV" + mode).style.visibility="visible";

oTransContainer.filters[0].Play();

//document.sideBar.src = '$board_skin_path/bgi_bar' + (parseInt(mode) - 1) + '.gif';
// eval("btn" + currentItem).src = '$board_skin_path/img/btn_no' + currentItem + '_off.gif';
// eval("btn" + mode).src = '$board_skin_path/img/btn_no' + mode + '_on.gif';

currentItem = mode;

if(mode >= 4)
{
nextItem = 1;
}
else
{
nextItem = parseInt(mode) + 1;
}

rotateTimmer = setTimeout('swapItem('+nextItem+')', 5000);
}

swapItem(currentItem);
</SCRIPT>
|

댓글 1개

너무 잘 썼습니다.~
소스 올려주셔서 감사합니다. 꾸벅
댓글을 작성하시려면 로그인이 필요합니다.

그누4 팁자료실

그누보드4와 관련된 팁을 여러분들과 함께 공유하세요. 나누면 즐거움이 커집니다.

+
제목 글쓴이 날짜 조회
19년 전 조회 3,905
19년 전 조회 8,735
19년 전 조회 3,588
19년 전 조회 9,425
19년 전 조회 4,118
19년 전 조회 4,151
19년 전 조회 3,466
19년 전 조회 2,684
19년 전 조회 2,970
19년 전 조회 3,506
19년 전 조회 4,633
19년 전 조회 2,924
19년 전 조회 4,402
19년 전 조회 3,280
19년 전 조회 4,141
19년 전 조회 2,823
19년 전 조회 3,557
19년 전 조회 6,251
19년 전 조회 5,430
19년 전 조회 2,540