|
|
|
@ -13,7 +13,8 @@
|
|
|
|
|
<script src="http://code.jquery.com/jquery-2.0.3.min.js"></script>
|
|
|
|
|
<script src="http://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.3/jquery.easing.min.js"></script>
|
|
|
|
|
<script src="../../js/jquery.easypiechart.min.js"></script>
|
|
|
|
|
|
|
|
|
|
<link rel="stylesheet" href="../../css/swiper.min.css">
|
|
|
|
|
<script src="../../js/swiper.min.js"></script>
|
|
|
|
|
</head>
|
|
|
|
|
|
|
|
|
|
<body>
|
|
|
|
@ -30,6 +31,11 @@
|
|
|
|
|
|
|
|
|
|
<!-- 메모리 카테고리 -->
|
|
|
|
|
<ul class="memory_ca">
|
|
|
|
|
<li>
|
|
|
|
|
<a href="../memory/memory_timeline.html">
|
|
|
|
|
타임라인
|
|
|
|
|
</a>
|
|
|
|
|
</li>
|
|
|
|
|
<li class="current">
|
|
|
|
|
<a href="../memory/memory_daily.html">
|
|
|
|
|
일간
|
|
|
|
@ -40,22 +46,51 @@
|
|
|
|
|
주간
|
|
|
|
|
</a>
|
|
|
|
|
</li>
|
|
|
|
|
<li>
|
|
|
|
|
<a href="../memory/memory_timeline.html">
|
|
|
|
|
타임라인
|
|
|
|
|
</a>
|
|
|
|
|
</li>
|
|
|
|
|
</ul>
|
|
|
|
|
<!-- //메모리 카테고리 -->
|
|
|
|
|
|
|
|
|
|
<!-- 컬러 박스 -->
|
|
|
|
|
<div class="color_box">
|
|
|
|
|
<button type="button" class="m_color01"></button>
|
|
|
|
|
<button type="button" class="m_color02"></button>
|
|
|
|
|
<button type="button" class="m_color03"></button>
|
|
|
|
|
<button type="button" class="m_color04"></button>
|
|
|
|
|
<button type="button" class="m_color05"></button>
|
|
|
|
|
<button type="button" class="m_color06"></button>
|
|
|
|
|
<div class="main_cont_kinds active" style="border: none">
|
|
|
|
|
<div class="swiper-container">
|
|
|
|
|
<div class="swiper-wrapper">
|
|
|
|
|
<div class="swiper-slide">
|
|
|
|
|
<a style="background-color: #FF7C80"><span>모유</span></a>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="swiper-slide">
|
|
|
|
|
<a style="background-color: #FF9933"><span>젖병</span></a>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="swiper-slide">
|
|
|
|
|
<a style="background-color: #FFCC00"><span>홈메이드</span></a>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="swiper-slide">
|
|
|
|
|
<a style="background-color: #A4DE00"><span>시판</span></a>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="swiper-slide">
|
|
|
|
|
<a style="background-color: #7FE1A7"><span>간식</span></a>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="swiper-slide">
|
|
|
|
|
<a style="background-color: #84DCD2"><span>수면</span></a>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="swiper-slide">
|
|
|
|
|
<a style="background-color: #A1D3E3"><span>대소변</span></a>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="swiper-slide">
|
|
|
|
|
<a style="background-color: #B5A0DC"><span>병원</span></a>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="swiper-slide">
|
|
|
|
|
<a style="background-color: #D09CE0"><span>체온</span></a>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="swiper-slide">
|
|
|
|
|
<a style="background-color: #EB91C7"><span>생활</span></a>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="swiper-slide">
|
|
|
|
|
<a style="background-color: #F38998"><span>성취</span></a>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="swiper-slide">
|
|
|
|
|
<a style="background-color: #D59A6D"><span>유축</span></a>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<!-- //컬러 박스 -->
|
|
|
|
|
|
|
|
|
@ -144,6 +179,31 @@
|
|
|
|
|
</nav>
|
|
|
|
|
<!-- //iyu_nav -->
|
|
|
|
|
|
|
|
|
|
<script>
|
|
|
|
|
// main_cont_kinds
|
|
|
|
|
$(".main_cont_kinds .swiper-slide a").click(function(e) {
|
|
|
|
|
e.stopPropagation();
|
|
|
|
|
|
|
|
|
|
if (!$(this).hasClass("on")) {
|
|
|
|
|
$(".main_cont_kinds li a.on").removeClass("on");
|
|
|
|
|
$(this).addClass("on");
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
var swiper = new Swiper('.swiper-container', {
|
|
|
|
|
slidesPerView: 5,
|
|
|
|
|
slidesPerGroup: 1,
|
|
|
|
|
spaceBetween: 10,
|
|
|
|
|
|
|
|
|
|
loopFillGroupWithBlank: true,
|
|
|
|
|
|
|
|
|
|
pagination: {
|
|
|
|
|
loop: false,
|
|
|
|
|
el: '.swiper-pagination',
|
|
|
|
|
clickable: true
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
</script>
|
|
|
|
|
</body>
|
|
|
|
|
|
|
|
|
|
</html>
|
|
|
|
|