mainbanner.10.skin 파일을 카피해서 메인에 배너를 하나더 추가해서 넣었습니다.
각각 배너를 하나씩만 넣으면 잘나오는데 메인페이지에 배너가 2개 노출될경우
그중에 하나가 css 연동이 안되고 깨지는거 같아요.
배너노출 잘되고 다른곳은 이상없는거 같은데,
좌, 우 버튼이 css적용이 안되는거 같아요.
Copy
<?phpif (!defined("_GNUBOARD_")) exit; // 개별 페이지 접근 불가 // add_stylesheet('css 구문', 출력순서); 숫자가 작을 수록 먼저 출력됨//add_stylesheet('<link rel="stylesheet" href="'.G5_SHOP_SKIN_URL.'/style.css">', 0);add_stylesheet('<link rel="stylesheet" href="'.G5_SHOP_SKIN_URL.'/boxbanner.mini_top.css">', 0);?> <?php$max_width = $max_height = 0;$bn_first_class = ' class="sbn_top_first"'; for ($i=0; $row=sql_fetch_array($result); $i++){ if ($i==0) echo '<section id="sbn_top_idx" class="sbn_top">'.PHP_EOL.'<h2>쇼핑몰 배너</h2>'.PHP_EOL.'<ul>'.PHP_EOL; //print_r2($row); // 테두리 있는지 $bn_border = ($row['bn_border']) ? ' class="sbn_top_border"' : '';; // 새창 띄우기인지 $bn_new_win = ($row['bn_new_win']) ? ' target="_blank"' : ''; $bimg = G5_DATA_PATH.'/banner/'.$row['bn_id']; if (file_exists($bimg)) { $banner = ''; $size = getimagesize($bimg); if($size[2] < 1 || $size[2] > 16) continue; if($max_width < $size[0]) $max_width = $size[0]; if($max_height < $size[1]) $max_height = $size[1]; echo '<li'.$bn_first_class.'>'.PHP_EOL; if ($row['bn_url'][0] == '#') $banner .= '<a href="'.$row['bn_url'].'">'; else if ($row['bn_url'] && $row['bn_url'] != 'http://') { $banner .= '<a href="'.G5_SHOP_URL.'/bannerhit.php?bn_id='.$row['bn_id'].'&url='.urlencode($row['bn_url']).'"'.$bn_new_win.'>'; } echo $banner.'<img src="'.G5_DATA_URL.'/banner/'.$row['bn_id'].'" width="110" height="80" alt="'.$row['bn_alt'].'"'.$bn_border.'>'; if($banner) echo '</a>'.PHP_EOL; echo '</li>'.PHP_EOL; $bn_first_class = ''; }}if ($i>0) echo '</ul>'.PHP_EOL.'</section>'.PHP_EOL;?> <script>(function($) { var intervals = {}; var methods = { init: function(option) { if(this.length < 1) return false; var $bnnr = this.find("li:has(img)"); var count = $bnnr.size(); var $bnnr_a = $bnnr.find("a"); var width = <?php echo $max_width; ?>; var height = <?php echo $max_height; ?>; var wrap_width = this.parent().width(); var c_idx = o_idx = 0; var el_id = this[0].id; var $this = this; if(width > wrap_width) { height = parseInt(height * (wrap_width / width)); } width = wrap_width; this.width(wrap_width).height(height) .find("ul").width(width).height(height) .find("li").width(width).height(height); $bnnr.not(".sbn_top_first").css("left", width+"px"); $bnnr.each(function() { var $img = $(this).find("img"); var img_width = parseInt($img.attr("width")); if(img_width > width) img_width = width; $img.removeAttr("width"); $img.width(img_width); }); // 기본 설정값 var settings = $.extend({ interval: 5000, duration: 1500 }, option); if(count > 1) { var slide_button = "<div id=\"sbn_top_btn_p\" class=\"sbn_top_btn\"><button type=\"button\" id=\"sbn_top_btn_prev\" class=\"sbn_top_btn_slide\"><span><</span></button></div>\n"; slide_button += "<div id=\"sbn_top_btn_n\" class=\"sbn_top_btn\"><button type=\"button\" id=\"sbn_top_btn_next\" class=\"sbn_top_btn_slide\"><span>></span></button></div>"; this.find("ul").before(slide_button); var $bnnr_btn = this.find(".sbn_top_btn_slide"); $bnnr_btn.on("focusin", function() { clear_interval(); }); $bnnr_btn.on("focusout", function() { set_interval(); }); } set_interval(); $(".sbn_top_btn_slide").on("click", function() { if($this.find(":animated").size() > 0) return false; clear_interval(); var id = $(this).attr("id"); if(id.search("prev") > -1) { right_rolling(); } else { left_rolling(); } }); $bnnr.hover( function() { clear_interval(); }, function() { set_interval(); } ); $bnnr_a.on("focusin", function() { clear_interval(); }); $bnnr_a.on("focusout", function() { set_interval(); }); function left_rolling() { $bnnr.each(function(index) { if($(this).is(":visible")) { o_idx = index; return false; } }); $bnnr.not(":visible").css({ display: "none", left: "+"+width+"px" }); $bnnr.eq(o_idx).animate( { left: "-="+width+"px" }, settings.duration, function() { $(this).css("display", "none").css("left", width+"px"); } ); c_idx = (o_idx + 1) % count; $bnnr.eq(c_idx).css("display", "block").animate( { left: "-="+width+"px" }, settings.duration, function() { o_idx = c_idx; } ); } function right_rolling() { $bnnr.each(function(index) { if($(this).is(":visible")) { o_idx = index; return false; } }); $bnnr.not(":visible").css({ display: "none", left: "-"+width+"px" }); $bnnr.eq(o_idx).animate( { left: "+="+width+"px" }, settings.duration, function() { $(this).css("display", "none").css("left", "-"+width+"px"); } ); c_idx = (o_idx + 1) % count; $bnnr.eq(c_idx).css("display", "block").animate( { left: "+="+width+"px" }, settings.duration, function() { o_idx = c_idx; } ); } function set_interval() { if(count > 1) { clear_interval(); intervals[el_id] = setInterval(left_rolling, settings.interval); } } function clear_interval() { if(intervals[el_id]) { clearInterval(intervals[el_id]); } } }, stop: function() { var el_id = this[0].id; if(intervals[el_id]) clearInterval(intervals[el_id]); } }; $.fn.bannerRolling = function(option) { if (methods[option]) return methods[option].apply(this, Array.prototype.slice.call(arguments, 1)); else return methods.init.apply(this, arguments); }}(jQuery)); $(function() { $("#sbn_top_idx").bannerRolling(); // 기본 설정값을 변경하려면 아래처럼 사용 //$("#sbn_top_idx").leftRolling({ interval: 6000, duration: 2000 });});</script>어느곳을 수정해야 제대로 css가 적용되나요?
|
답변 3개 / 댓글 1개
채택된 답변
+20 포인트
쌔깜디블랙죠크롬 브라우저라 열어서 CSS 파일이 어디를 참조 하는지 확인하시면 됩니다.
변경하고자 하는 엘리멘트에서
우클릭->검사->우측 styles탭에서 파일명 위에 마우스를 대고 있으면
참조하고 있는 파일의 경로가 나옵니다.
테마랑, 일반 CSS랑 경로가 다르기 때문에 적용이 안되셨을 수 있습니다.
블랙앤화이트
2016-11-01 (화) 03:10:04
자체수정..
처음댓글을 달아주신분을 채택해드렸습니다.
$.fn.leftRolling = function(option) {
if (methods[option])
return methods[option].apply(this, Array.prototype.slice.call(arguments, 1));
else
return methods.init.apply(this, arguments);
}
}(jQuery));
$(function() {
//$("#sbn_top_idx").bannerRolling();
$("#sbn_top_idx").leftRolling({ interval: 7000, duration: 2000 });
// 기본 설정값을 변경하려면 아래처럼 사용 (스크립트에 있는 bannerRolling를 leftRolling으로 변경해야함)
//$("#sbnz_top_idx").leftRolling({ interval: 6000, duration: 2000 });
});
</script>
소스에 달려있는 주석대로 변경을 해주니 재대로 되는거 같네요.
-- 오류가 나길래 댓글을 지웠는데, 다른부분의 문제길래 댓글을 다시 달았습니다
메인베너를 2개이상 사용하실분은 적용해보세요.
2016-10-30 (일) 21:48:35
위 소스에서 sbn 문자를 sbn1 로 바꾸고 css 경로도 sbn1 로 바꿔서 로드해보세요..
답변에 대한 댓글 1개
블랙앤화이트
2016-10-31 (월) 12:57:11
답변을 작성하려면 로그인이 필요합니다.
sbn를 하나는 sbn_main으로 전부 바꾸고 또하나는 sbn_top으로 변경을 했어요.
혹시몰라서 sbn_top을 sbn1_top로 전부 변환해봤는데 아무런 변화는 없네요.
script 부분 때문인거 아닌가 생각되는데요.
전혀 볼줄을 몰라서....