모바일 작업 중 제이쿼리에 넣은 이미지들이 깨집니다.
본문
http://ektha7303.dothome.co.kr/
모바일로 봐주시고요.
답변 받은대로 소스를 적용시켰더니 이미지에 잘 적용이되어 깨지지 않았습니다.
적용한 소스는 각 이미지에 style="max-width:100px; width:100%; height:auto;"를 넣으면 된다는 답변을 받았구요.
아래 li가 두개 있는데 하나에는 이미지를 넣었고 하나는 롤링배너를 넣었습니다.
이미지를 넣는것은 안깨지는데 제이쿼리에 넣은 이미지들은 다시 깨지네요 .
왜그러는걸까요??
<ul>
<li><a href="/bbs/content.php?co_id=company"><img src="/mobile/images/main_con01.jpg" border="0" style="width:100%; max-width:690px; height:auto;" /></a></li>
<li>
<script src="<?php echo G5_JS_URL; ?>/swipe.js"></script>
<script src="<?php echo G5_JS_URL; ?>/shop.mobile.main.js"></script>
<!-- Main Visual -->
<link href="<?php echo G5_CSS_URL; ?>/swiper.min.css" rel="stylesheet">
<script src="<?php echo G5_JS_URL; ?>/swiper.min.js"></script>
<div class="swiper-container">
<div class="swiper-wrapper">
<div class="swiper-slide"><a href="/bbs/content.php?co_id=Business01"><img src="<?php echo G5_URL; ?>/mobile/images/main_con0201.jpg" border="0" style="max-width:690px !important; width:100% !important; height:auto !important;"></a></div>
<div class="swiper-slide"><a href="/bbs/content.php?co_id=Business02"><img src="<?php echo G5_URL; ?>/mobile/images/main_con0202.jpg" border="0" style="max-width:690px !important; width:100% !important; height:auto !important;"></a></div>
<div class="swiper-slide"><a href="/bbs/content.php?co_id=Business03"><img src="<?php echo G5_URL; ?>/mobile/images/main_con0203.jpg" border="0" style="max-width:690px !important; width:100% !important; height:auto !important;"></a></div>
<div class="swiper-slide"><a href="/bbs/content.php?co_id=Business04"><img src="<?php echo G5_URL; ?>/mobile/images/main_con0204.jpg" border="0" style="max-width:690px !important; width:100% !important; height:auto !important;"></a></div>
</div>
<!-- Add Pagination -->
<div class="swiper-pagination"></div>
<!-- Add Arrows -->
<!--
<div class="swiper-button-next"></div>
<div class="swiper-button-prev"></div>
-->
</div>
<!-- Initialize Swiper -->
<script>
var swiper = new Swiper('.swiper-container', {
pagination: '.swiper-pagination',
nextButton: '.swiper-button-next',
prevButton: '.swiper-button-prev',
paginationClickable: true,
spaceBetween: 30,
centeredSlides: true,
autoplay: 2500,
autoplayDisableOnInteraction: false,
loop: true
});
</script>
<!--// Main Visual -->
</div></li>
</ul>
