grape 테마 배너 속도 조절 어디서 해야할까요?

트루스토리 자기소개 회원게시물 회원 질문검색 회원 답변검색 회원 댓글검색

자기소개 회원게시물 회원 질문검색 회원 답변검색 회원 댓글검색

2023.04.26 13:52:38 1341 (59.♡.♡.11)

답변 2

본문

안녕하세요^^

grape 테마 메인화면 배너 움직이는 속도를 좀 늦추고 싶은데,

아무리 봐도 속도를 어디서 조절해야하는지 모르겠습니다.

latest.skin.php 파일입니다.


<?php
if (!defined('_GNUBOARD_')) exit; // 개별 페이지 접근 불가
include_once(G5_LIB_PATH.'/thumbnail.lib.php');
global $is_admin; 
// add_stylesheet('css 구문', 출력순서); 숫자가 작을 수록 먼저 출력됨
add_stylesheet('<link rel="stylesheet" href="'.$latest_skin_url.'/style.css">', 0);
add_javascript('<script src="'.G5_JS_URL.'/jquery.bxslider.js"></script>', 10);
$thumb_width = 300;
$thumb_height = 200;
?>
<!-- <?php echo $bo_subject; ?> 최신글 시작 { -->
<div class="lt_bn">
    <ul>
    <?php
    for ($i=0; $i<count($list); $i++) {
    $thumb = get_list_thumbnail($bo_table, $list[$i]['wr_id'], $thumb_width, $thumb_height, false, true);
    if($thumb['ori']) {
        $img = $thumb['ori'];
    } else {
        $img = G5_IMG_URL.'/no_img.png';
        $thumb['alt'] = '이미지가 없습니다.';
    }
    ?>
        <li class="list_<?php echo $i ?>">
            <div class="bg"><a href="<?php echo $list[$i]['href']; ?>" ><img src="<?php echo $img; ?>"></a></div>
            <div class="bn_txt">
                <div class="txt_wr">
                        <?php
                        echo "<a href=\"".$list[$i]['href']."\"  class=\"bn_tit\">";
                            echo $list[$i]['subject'];
                        echo "</a>";
                        ?>
                        <div class="bn_detail"> <?php echo get_text(cut_str(strip_tags($list[$i]['wr_content']), 50), 1); ?></div>
                        <?php
                        echo "<a href=\"".$list[$i]['href']."\" class=\"bn_view\">자세히보기<span class=\"arrow\"></span></a>";
                        ?>
                </div>
            </div>
        </li>
    <?php }  ?>
    <?php if (count($list) == 0) { //게시물이 없을 때  ?>
    <li class="empty_li">게시물이 없습니다.</li>
    <?php }  ?>
    </ul>
    <?php if ($is_admin) { ?><a href="<?php echo get_pretty_url($bo_table); ?>" class="bn_link btn_admin btn_m"><i class="fa fa-cog"></i><span class="sound_only"><?php echo $bo_subject ?></span></a> <?php }  ?>
</div>

<script>
$('.lt_bn ul').show().bxSlider({
    pager:false,
    controls:true,
    auto:true
});
</script>
<!-- } <?php echo $bo_subject; ?> 최신글 끝 -->

style.css 파일입니다.


@charset "utf-8";
.lt_bn {position:relative}
.lt_bn li{position:relative;text-align:center;}
.lt_bn li img{width:100%;height:auto;vertical-align:top}
.lt_bn .bn_txt{width:100%;z-index:2;position:absolute;text-align:left; top:50%;left:0;
-webkit-transform: translateY(-50%);
-ms-transform : translateY(-50%);
transform: translateY(-50%);}
.lt_bn .txt_wr{max-width:1280px;margin:0 auto;padding:0 3%}
.lt_bn li .bn_tit{display:block;max-width:500px;font-size:4em;font-weight:600; line-height:1.4em;color:#4ad1d4;word-break:keep-all}
.lt_bn li .bn_detail{font-size:1.385em;margin:35px 0 ;color:#888;font-weight:400}
.lt_bn li .bn_view {display:inline-block;background:none;color:#4ad1d4;border:2px solid #4ad1d4;padding:0 25px;line-height:45px;border-radius:30px;
;transition: 0.3s all ease-in-out;
-webkit-transition: 0.3s all ease-in-out;
-moz-transition: 0.3s all ease-in-out;
-o-transition: 0.3s all ease-in-out;
-ms-transition: 0.3s all ease-in-out}
.lt_bn li .bn_view:hover{background:#4ad1d4;color:#fff}
.arrow{position: relative; display: inline-block;vertical-align: middle;transform: rotate(45deg);box-sizing: border-box;width: 11px;height: 11px; border-width: 2px 2px 0 0; border-style: solid;margin-left: 25px;}
.arrow:before {right: 0; top: -1px; position: absolute; height: 2px; box-shadow: inset 0 0 0 32px; width: 18px;
-webkit-transform: rotate(-45deg);transform: rotate(-45deg);
-webkit-transform-origin: right top;}
.arrow:after,.arrow:before {content: "";box-sizing: border-box;}
.lt_bn .bx-prev{position:absolute;top:50%;left:0;width:50px;height:50px;margin-top:-25px;opacity:0.5;text-indent:-999px;overflow:hidden;background:url(prev.png) no-repeat 50% 50%  rgba(0,0,0,0.1)}
.lt_bn .bx-next{position:absolute;top:50%;right:0;width:50px;height:50px;margin-top:-25px;opacity:0.5;text-indent:-999px;overflow:hidden;background:url(next.png) no-repeat 50% 50%  rgba(0,0,0,0.1)}
.lt_bn .bx-prev:hover,.lt_bn .bx-next:hover{opacity:1}
.lt_bn .bn_link {display:block;position:absolute;top:10px;right:10px;background:#ff0000;color:#fff;border-radius:50px;width:40px;padding:0;line-height:40px;text-align:center;opacity:0}
.lt_bn:hover .bn_link{opacity:1} 
@media (max-width:1279px){    
    .lt_bn li .bn_tit {font-size:3em}
    .lt_bn li .bn_detail{font-size:1.2em;margin:20px 0}
 }
@media (max-width: 969px){
    .lt_bn li .bn_tit {font-size:2.5em}
    .lt_bn li .bn_detail{font-size:1em} 
    .lt_bn li .bn_view{line-height:40px;font-size:1em}
    .lt_bn .txt_wr{padding:40px}
 }
@media (max-width: 639px){
    .lt_bn li .bn_tit {font-size:1.8em;width:60%}
    .lt_bn li .bn_view{display:none}
    .lt_bn li .bn_detail{display:none}
    .lt_bn .bx-prev,.lt_bn .bx-next{width:36px;height:36px;margin-top:-18px;background-size:25%}
}