최근게시물 첨부파일2개 사용해서 롤오버 효과 만들기 질문입니다 정보
최근게시물 첨부파일2개 사용해서 롤오버 효과 만들기 질문입니다본문
아 이거때문에 지금 며칠쨰 고생이네요
아래에도 질문했는데 해결되지 않아 다시 질문하니다
지금 상태에서 롤오버했을떄 첨부파일 2번이 보여지면 되는데요..
이걸 어떠헥 적용해야할지요..
지금 들어가면 첨부파일 1번과 배경이미지 하나가 썸네일로 보여지는데
롤오버하면 배경이미지만 사라집니다
근데 적용하고싶은건 롤오버했을떄 그위에 첨부파일 2번이 보이게 하려구요
$file = $list[$i][file][0][path] .'/'. $list[$i][file][0][file];
이 부분을
$file = $list[$i][file][1][path] .'/'. $list[$i][file][1][file];
이렇게 바꾸면 첨부파일 2번이 보여지긴 하는데요
첨부파일 1번과 2번을 다 사용하면서 2번첨부파일을 롤오버했을때 나오게 하려면
어떻게 해야할지..........
latest.skin.php
--------------------------------------------------------------------------------------
<?
if (!defined("_GNUBOARD_")) exit; // 개별 페이지 접근 불가
//불당썸 설치 필 수
include_once("$g4[path]/lib/thumb.lib.php");
$img_width = 260; //표시할 이미지의 가로사이즈
$img_height = 160; //표시할 이미지의 세로사이즈
//언샾마스트 퀄리티(썸 노이즈바지)
$th['filter'] = array();
$th['filter']['type'] = 90;
$th['filter']['arg1'] = 100;
$th['filter']['arg2'] = 1;
$th['filter']['arg3'] = 2;
$noimg = $latest_skin_path."/images/noimg.jpg";
$write_table =$g4[write_prefix].$bo_table;
$cat_row = sql_fetch(" SELECT bo_category_list FROM $g4[board_table] WHERE bo_table = '$bo_table' ");
$ca_name_arr = explode("|", $cat_row[bo_category_list]); // 구분자가 , 로 되어 있음
?>
<link rel="stylesheet" href="<?=$latest_skin_path?>/css/style.css" type="text/css"/>
<link rel="stylesheet" href="<?=$latest_skin_path?>/css/prettyPhoto.css" type="text/css"/><!-- Necessary for lightbox Popups -->
<script type="text/javascript" src="<?=$latest_skin_path?>/js/main.js"></script>
<script type="text/javascript" src="<?=$latest_skin_path?>/js/jquery.prettyPhoto.js"></script><!-- Necessary for Popups -->
<script type="text/javascript" src="<?=$latest_skin_path?>/js/popups.js"></script>
<!-- Necessary for Sorted -->
<script type="text/javascript" src="<?=$latest_skin_path?>/js/jquery.easing.1.3.js"></script>
<script type="text/javascript" src="<?=$latest_skin_path?>/js/jquery.quicksand.js"></script>
<script type="text/javascript" src="<?=$latest_skin_path?>/js/quicksand.js"></script>
</head>
<body>
<div class="wrapper">
<!-- CONTENT BEGIN -->
<div id="content" class="block_portfolio_4c" >
<div class="inner" >
<div class="separator_14"></div>
<div class="separator_26"></div>
<div class="block_four_columns" id="container" >
<ul class="block_filtered_items">
<!-- portfolio item -->
<?
for ($i=0; $i<count($list); $i++) {
$file = $list[$i][file][0][path] .'/'. $list[$i][file][0][file];
$file2 = $list[$i][file][1][path] .'/'. $list[$i][file][1][file];
// 업로드된 파일이 이미지라면
if (preg_match("/\.(jpg|gif|png|bmp)$/i", $file) && file_exists($file)) {
$thumb = thumbnail($file, $img_width, $img_height, 0, 1, 90, 0, "", $filter, $noimg); //첨부파일 언샾마스크추가
} else { //에디터에서 삽입한 이미지
$edit_img = $list[$i]['wr_content'];
if (eregi("data/cheditor4[^<>]*\.(gif|jp[e]?g|png|bmp)", $edit_img, $tmp)) { // data/cheditor------
$file = $g4[path].'/' . $tmp[0]; // 파일명
$thumb=thumbnail($file, $img_width, $img_height, 0, 1, 90, 0, "", $filter, $noimg); //언샾마스크추가
}
}
$content = cut_str(strip_tags($list[$i][wr_content]), 76);
?>
<li class="column_3 filtering_item <?=$list[$i][wr_link1]?"video":""?> item1" title="<?=$list[$i][ca_name]?>" style="margin:0 30px 40px 0 ;">
<div class="pic_wrapper">
<span class="block_general_pic">
<? if ($list[$i][wr_link1]) { ?>
<a href="<?=$list[$i][wr_link1]?>" rel="prettyPhoto[gallery]" title="" class="hover_1">
<? } else { ?>
<a href="<?=$file?>" rel="prettyPhoto[gallery]" title="" class="hover_1">
<? } ?>
<img width="<?=$img_width?>" height="<?=$img_height?>" src="<?=$thumb?>" class="r_conner_pic wp-post-image" alt="<?=$list[$i][subject]?>" title="" />
<span class="block_hover"> </span>
</a>
<a href="<?=$list[$i][href]?>" class="post_link"><span>Full Post</span></a>
</span>
</div>
<h3 style="font-family:돋움,'NanumGothicWeb', Arial, Helvetica, sans-serif; font-size:14px; color:#5d5d5d; font-weight:bold; height:25px;"><? if ($is_admin == "super") { ?><a href="<?=$list[$i][href]?>"><?=$list[$i][subject]?></a>
<?}else{?>
<?=$list[$i][subject]?>
<?}?></h3>
<p class="description" style="font-family:돋움,'NanumGothicWeb', Arial, Helvetica, sans-serif; font-size:12px; color:#5d5d5d; font-weight:light; height:30px; "><?=$content?>
<? if ($is_admin == "super") { ?><a href="<?=$list[$i][href]?>" class="arr_d"><img src="<?=$latest_skin_path?>/images/arrow_1.gif" alt="" /></a> <?}else{?>
<?}?></p>
<p class="line" style="border-bottom: 1px solid #ffffff;" ></p>
</li>
<? } ?>
<!-- portfolio item -->
</ul>
</div>
<div class="separator_16"></div>
</div>
</div>
<!-- CONTENT END -->
<div class="separator_6"></div>
</div>
---------------------------------------------------------------------------
style.css
-----------------------------------------------------------------------------------
.block_portfolio_4c .block_four_columns{overflow:hidden; margin:0 -20px -19px -25px;}
.portfolio_gallery_without_sorting .block_four_columns{margin-left:-16px;}
.block_portfolio_4c .block_four_columns .column_3{margin:0 0 0 25px; vertical-align:top; float:left; height:241px; overflow:visible; width:276px;}
.portfolio_page_without_sorting .block_portfolio_4c .block_four_columns .column_3{height:264px;}
.portfolio_gallery_without_sorting .block_portfolio_4c .block_four_columns .column_3{height:168px; width:223px; margin:0 0 0 16px;}
.block_portfolio_4c .block_four_columns #block_filtered_items{height:auto;}
.block_portfolio_4c .block_four_columns .r_conner_pic{width:206px;height:160px; overflow:hidden;}
.portfolio_gallery_without_sorting .block_portfolio_4c .block_four_columns .r_conner_pic{width:213px;height:142px; overflow:hidden;}
.block_portfolio_4c .block_four_columns .block_filter {padding-bottom:3px;}
.block_portfolio_4c .block_four_columns .block_general_pic_w_desc {width:274px; margin-left:28px; padding-top:13px; float:left;}
.block_portfolio_4c .block_four_columns h3{margin:15px 0 9px 7px;font-size:14px;}
.block_portfolio_4c .block_four_columns h3, .block_portfolio_4c .block_four_columns h3 a{color:#333333; font-size:14px;}
.block_portfolio_4c .block_four_columns h3 a:hover{color:#0a71a0; text-decoration:none;}
.block_portfolio_4c .block_four_columns .description{color:#808080; margin:0 7px; text-decoration:none; font-size:11px; line-height:17px;}
.portfolio_page_without_sorting .block_portfolio_4c .block_four_columns .description{margin-bottom:9px;}
.block_portfolio_4c .block_general_pic a .block_hover{background-image:url(../images/zoom_video.png) !important;}
.block_portfolio_4c .video .block_general_pic a .block_hover{background-image:url(../images/zoom_video.png) !important;}
마지막줄이 배경이미지
.block_portfolio_4c .video .block_general_pic a .block_hover{background-image:url(../images/zoom_video.png) !important;}
를 나타내는거 같은데요 여기에 첨부파일 2번을 나오게 추가하면되는데....
아래에도 질문했는데 해결되지 않아 다시 질문하니다
지금 상태에서 롤오버했을떄 첨부파일 2번이 보여지면 되는데요..
이걸 어떠헥 적용해야할지요..
지금 들어가면 첨부파일 1번과 배경이미지 하나가 썸네일로 보여지는데
롤오버하면 배경이미지만 사라집니다
근데 적용하고싶은건 롤오버했을떄 그위에 첨부파일 2번이 보이게 하려구요
$file = $list[$i][file][0][path] .'/'. $list[$i][file][0][file];
이 부분을
$file = $list[$i][file][1][path] .'/'. $list[$i][file][1][file];
이렇게 바꾸면 첨부파일 2번이 보여지긴 하는데요
첨부파일 1번과 2번을 다 사용하면서 2번첨부파일을 롤오버했을때 나오게 하려면
어떻게 해야할지..........
latest.skin.php
--------------------------------------------------------------------------------------
<?
if (!defined("_GNUBOARD_")) exit; // 개별 페이지 접근 불가
//불당썸 설치 필 수
include_once("$g4[path]/lib/thumb.lib.php");
$img_width = 260; //표시할 이미지의 가로사이즈
$img_height = 160; //표시할 이미지의 세로사이즈
//언샾마스트 퀄리티(썸 노이즈바지)
$th['filter'] = array();
$th['filter']['type'] = 90;
$th['filter']['arg1'] = 100;
$th['filter']['arg2'] = 1;
$th['filter']['arg3'] = 2;
$noimg = $latest_skin_path."/images/noimg.jpg";
$write_table =$g4[write_prefix].$bo_table;
$cat_row = sql_fetch(" SELECT bo_category_list FROM $g4[board_table] WHERE bo_table = '$bo_table' ");
$ca_name_arr = explode("|", $cat_row[bo_category_list]); // 구분자가 , 로 되어 있음
?>
<link rel="stylesheet" href="<?=$latest_skin_path?>/css/style.css" type="text/css"/>
<link rel="stylesheet" href="<?=$latest_skin_path?>/css/prettyPhoto.css" type="text/css"/><!-- Necessary for lightbox Popups -->
<script type="text/javascript" src="<?=$latest_skin_path?>/js/main.js"></script>
<script type="text/javascript" src="<?=$latest_skin_path?>/js/jquery.prettyPhoto.js"></script><!-- Necessary for Popups -->
<script type="text/javascript" src="<?=$latest_skin_path?>/js/popups.js"></script>
<!-- Necessary for Sorted -->
<script type="text/javascript" src="<?=$latest_skin_path?>/js/jquery.easing.1.3.js"></script>
<script type="text/javascript" src="<?=$latest_skin_path?>/js/jquery.quicksand.js"></script>
<script type="text/javascript" src="<?=$latest_skin_path?>/js/quicksand.js"></script>
</head>
<body>
<div class="wrapper">
<!-- CONTENT BEGIN -->
<div id="content" class="block_portfolio_4c" >
<div class="inner" >
<div class="separator_14"></div>
<div class="separator_26"></div>
<div class="block_four_columns" id="container" >
<ul class="block_filtered_items">
<!-- portfolio item -->
<?
for ($i=0; $i<count($list); $i++) {
$file = $list[$i][file][0][path] .'/'. $list[$i][file][0][file];
$file2 = $list[$i][file][1][path] .'/'. $list[$i][file][1][file];
// 업로드된 파일이 이미지라면
if (preg_match("/\.(jpg|gif|png|bmp)$/i", $file) && file_exists($file)) {
$thumb = thumbnail($file, $img_width, $img_height, 0, 1, 90, 0, "", $filter, $noimg); //첨부파일 언샾마스크추가
} else { //에디터에서 삽입한 이미지
$edit_img = $list[$i]['wr_content'];
if (eregi("data/cheditor4[^<>]*\.(gif|jp[e]?g|png|bmp)", $edit_img, $tmp)) { // data/cheditor------
$file = $g4[path].'/' . $tmp[0]; // 파일명
$thumb=thumbnail($file, $img_width, $img_height, 0, 1, 90, 0, "", $filter, $noimg); //언샾마스크추가
}
}
$content = cut_str(strip_tags($list[$i][wr_content]), 76);
?>
<li class="column_3 filtering_item <?=$list[$i][wr_link1]?"video":""?> item1" title="<?=$list[$i][ca_name]?>" style="margin:0 30px 40px 0 ;">
<div class="pic_wrapper">
<span class="block_general_pic">
<? if ($list[$i][wr_link1]) { ?>
<a href="<?=$list[$i][wr_link1]?>" rel="prettyPhoto[gallery]" title="" class="hover_1">
<? } else { ?>
<a href="<?=$file?>" rel="prettyPhoto[gallery]" title="" class="hover_1">
<? } ?>
<img width="<?=$img_width?>" height="<?=$img_height?>" src="<?=$thumb?>" class="r_conner_pic wp-post-image" alt="<?=$list[$i][subject]?>" title="" />
<span class="block_hover"> </span>
</a>
<a href="<?=$list[$i][href]?>" class="post_link"><span>Full Post</span></a>
</span>
</div>
<h3 style="font-family:돋움,'NanumGothicWeb', Arial, Helvetica, sans-serif; font-size:14px; color:#5d5d5d; font-weight:bold; height:25px;"><? if ($is_admin == "super") { ?><a href="<?=$list[$i][href]?>"><?=$list[$i][subject]?></a>
<?}else{?>
<?=$list[$i][subject]?>
<?}?></h3>
<p class="description" style="font-family:돋움,'NanumGothicWeb', Arial, Helvetica, sans-serif; font-size:12px; color:#5d5d5d; font-weight:light; height:30px; "><?=$content?>
<? if ($is_admin == "super") { ?><a href="<?=$list[$i][href]?>" class="arr_d"><img src="<?=$latest_skin_path?>/images/arrow_1.gif" alt="" /></a> <?}else{?>
<?}?></p>
<p class="line" style="border-bottom: 1px solid #ffffff;" ></p>
</li>
<? } ?>
<!-- portfolio item -->
</ul>
</div>
<div class="separator_16"></div>
</div>
</div>
<!-- CONTENT END -->
<div class="separator_6"></div>
</div>
---------------------------------------------------------------------------
style.css
-----------------------------------------------------------------------------------
.block_portfolio_4c .block_four_columns{overflow:hidden; margin:0 -20px -19px -25px;}
.portfolio_gallery_without_sorting .block_four_columns{margin-left:-16px;}
.block_portfolio_4c .block_four_columns .column_3{margin:0 0 0 25px; vertical-align:top; float:left; height:241px; overflow:visible; width:276px;}
.portfolio_page_without_sorting .block_portfolio_4c .block_four_columns .column_3{height:264px;}
.portfolio_gallery_without_sorting .block_portfolio_4c .block_four_columns .column_3{height:168px; width:223px; margin:0 0 0 16px;}
.block_portfolio_4c .block_four_columns #block_filtered_items{height:auto;}
.block_portfolio_4c .block_four_columns .r_conner_pic{width:206px;height:160px; overflow:hidden;}
.portfolio_gallery_without_sorting .block_portfolio_4c .block_four_columns .r_conner_pic{width:213px;height:142px; overflow:hidden;}
.block_portfolio_4c .block_four_columns .block_filter {padding-bottom:3px;}
.block_portfolio_4c .block_four_columns .block_general_pic_w_desc {width:274px; margin-left:28px; padding-top:13px; float:left;}
.block_portfolio_4c .block_four_columns h3{margin:15px 0 9px 7px;font-size:14px;}
.block_portfolio_4c .block_four_columns h3, .block_portfolio_4c .block_four_columns h3 a{color:#333333; font-size:14px;}
.block_portfolio_4c .block_four_columns h3 a:hover{color:#0a71a0; text-decoration:none;}
.block_portfolio_4c .block_four_columns .description{color:#808080; margin:0 7px; text-decoration:none; font-size:11px; line-height:17px;}
.portfolio_page_without_sorting .block_portfolio_4c .block_four_columns .description{margin-bottom:9px;}
.block_portfolio_4c .block_general_pic a .block_hover{background-image:url(../images/zoom_video.png) !important;}
.block_portfolio_4c .video .block_general_pic a .block_hover{background-image:url(../images/zoom_video.png) !important;}
마지막줄이 배경이미지
.block_portfolio_4c .video .block_general_pic a .block_hover{background-image:url(../images/zoom_video.png) !important;}
를 나타내는거 같은데요 여기에 첨부파일 2번을 나오게 추가하면되는데....
댓글 전체
스타일을 주어서 if문으로 마우스어프 일때 1번파일 마우스온일때 2번파일이 출력되도록 하시면되겠네요.
답변감사합니다.. 어느부분에 스타일을 어떤식으로 주어야 할까요..?
