hyohyo0803
/
DYStudy
1
0
Fork 1
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

삭제 'copy.txt'

master
kimdoyoung 3 years ago
parent
4dcd0cf488
commit
13dfb6f727
1 changed files with 0 additions and 393 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 393
      copy.txt

393
copy.txt
Unescape View File

@ -1,393 +0,0 @@
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>음성명작페스티벌</title>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/swiper@8/swiper-bundle.min.css" />
<link href="https://unpkg.com/aos@2.3.1/dist/aos.css" rel="stylesheet">
<link rel="stylesheet" href="./main.css">
</head>
<body>
<!--네비-->
<nav id="nav" class="nav">
<div class="login-sec">
<ul class="login-menu">
<li class="sign-up cusor-p "><a href=""> 회원가입</a></li>
<li>|</li>
<li class="login cusor-p ">로그인</li>
</ul>
</div>
<div class="logo-sec">
<img class="nav-logo" src="./main/logo/logo_big.png" alt="음성명작 페스티벌">
<img class="nav-logo-m" src="./main/logo/logo_small.png" alt="음성명작 페스티벌 모바일 홈페이지">
</div>
<div class="gnb">
<ul class="main-menu">
<li class="cusor-p ">축제소개</li>
<li class="cusor-p ">주요 콘텐츠</li>
<li class="cusor-p ">이벤트</li>
<li class="cusor-p ">명작스토리</li>
<li class="cusor-p ">커뮤니티</li>
</ul>
<ul class="gnb-sns">
<li class="cusor-p gnb-sns-item insta"></li>
<li class="cusor-p gnb-sns-item blog"></li>
<li class="cusor-p gnb-sns-item youtube"></li>
<li class="cusor-p gnb-sns-item face"></li>
</ul>
</div>
<div class="gnb-line"></div>
<div class="toggle-btn cusor-p">
<div class="toggle-bar"></div>
<div class="toggle-bar"></div>
<div class="toggle-bar"></div>
</div>
</nav>
<!-- 스크롤 네비-->
<nav id="scroll-nav" class="nav-scroll hide">
<div class="scroll-nav-top">
<ul class="gnb-sns">
<li class="cusor-p gnb-sns-item insta"></li>
<li class="cusor-p gnb-sns-item face"></li>
<li class="cusor-p gnb-sns-item blog"></li>
<li class="cusor-p gnb-sns-item youtube"></li>
</ul>
<div class="login-sec">
<ul class="login-menu">
<li class="sign-up cusor-p "><a href=""> 회원가입</a></li>
<li>|</li>
<li class="login cusor-p ">로그인</li>
</ul>
</div>
</div>
<div class="scroll-nav-bottom">
<div class="logo-sec">
<img class="nav-logo-m" src="./main/logo/logo_small.png" alt="음성명작 페스티벌 홈페이지">
</div>
<div class="gnb">
<ul class="main-menu">
<li class="cusor-p ">축제소개</li>
<li class="cusor-p ">축제안내</li>
<li class="cusor-p ">명작스토리</li>
<li class="cusor-p ">게시판</li>
</ul>
</div>
</div>
<div class="gnb-line"></div>
<div class="toggle-btn cusor-p">
<div class="toggle-bar"></div>
<div class="toggle-bar"></div>
<div class="toggle-bar"></div>
</div>
</nav>
<!--모바일 네비-->
<div class="m-menu-box hide">
<div class="m-menu">
<div class="m-login-sec">
<ul class="m-login-menu">
<li class="m-sign-up cusor-p "><a href=""> 회원가입</a></li>
<li>|</li>
<li class="m-login cusor-p ">로그인</li>
</ul>
</div>
<div class="m-gnb">
<ul class="m-main-menu">
<li class="cusor-p ">축제소개</li>
<li class="cusor-p ">축제안내</li>
<li class="cusor-p ">명작스토리</li>
<li class="cusor-p ">커뮤니티</li>
</ul>
</div>
</div>
</div>
<!--메인-->
<main id="main">
<!--메인 슬라이드-->
<section class="slider-sec">
<div class="slider-outer">
<div class="swiper mySwiper">
<div class="swiper-wrapper">
<div class="swiper-slide">
<a href="">
<img src="./main/main/img_slide1.png" alt="음성명작 페스티벌 배너 광고1">
</a>
</div>
<div class="swiper-slide">
<a href="">
<img src="./main/main/img_slide2.png" alt="음성명작 페스티벌 배너 광고2">
</a>
</div>
<div class="swiper-slide">
<a href="">
<img src="./main/main/img_slide3.png" alt="음성명작 페스티벌 배너 광고3"></a>
</div>
</div>
<div class="swiper-pagination"></div>
</div>
</div>
</section>
<!--메인 공지-->
<section class="notice-sec">
<div class="notice notice-fade-out ">
<h4>공지사항</h4>
<div class="notice-roll-box">
<ul class="notice-roll">
<li class="cusor-p">
<a class="notice-text" href="">음성군 6월 대표과일!</a>
</li>
<li class="cusor-p">
<a class="notice-text" href="">2021 음성명작 페스티벌 사이트가 리뉴얼 되었습니다~</a>
</li>
<li class="cusor-p">
<a class="notice-text" href="">음성군 6월 대표과일!</a>
</li>
</ul>
</div>
<button class="notice-btn cusor-p "><img src="./main/icon/more.png" alt="공지사항 더보기 버튼"></button>
</div>
<div class="banner">
<a href="" class="notice-banner-animation0-off">
<img src="./main/main/con1.png" alt="음성명작 페스티벌 잔치잔치 열렸네! - 포스터">
</a>
<a href="" class="notice-banner-animation1-off">
<img src="./main/main/con2.png" alt="문예공모전 결과 발표 - 포스터">
</a>
<a href="" class="notice-banner-animation2-off">
<img src="./main/main/con3.png" alt="명작 스토리 안심농가 방문 - 포스터">
</a>
</div>
</section>
<!--메인 바텀 슬라이드-->
<section class="bot-slider-sec bot-slider-fade-out">
<div class="bot-slider-box">
<div class="bot-slider-text-box">
<div class="text">
<span>음성명작페스티벌</span>
<span><strong>둘러보기!</strong></span>
<span>음성명작페스티벌</span>
<span>백배 즐기기</span>
</div>
<div class="bot-slider-btn-box">
<button class="cusor-p bot-slider-btn bot-swiper-button-prev " id="prev">
<img src="./main/icon/card_left.png" alt="음성명작 페스티벌 둘러보기 이미지 넘기기 이전">
</button>
<button class="cusor-p bot-slider-btn bot-swiper-button-next" id="next">
<img src="./main/icon/card_right.png" alt="음성명작 페스티벌 둘러보기 이미지 넘기기 다음">
</button>
</div>
</div>
<div class="bot-slider-outer">
<div class="swiper bot-swiper">
<div class="swiper-wrapper">
<a href="" class="swiper-slide">
<img src="./main/main/ban1.png" alt="축제공간구성 위치확인하고 빠르게 찾아가자 바로가기">
</a>
<a href="" class="swiper-slide">
<img src="./main/main/ban2.png" alt="축제프로그램 다양한 공연과 체험 프로그램 바로가기">
</a>
<a href="" class="swiper-slide">
<img src="./main/main/ban3.png" alt="지난이야기 음성명작 페스티벌 발자취 바로가기">
</a>
</div>
</div>
</div>
</div>
</section>
<!--메인 협업사-->
<section class="alliance-sec">
<div class="alliance-bar">
<a href=""><img src="./main/logo/btm_banner1.png" alt="음성군 홈페이지 바로가기"></a>
<a href=""><img src="./main/logo/btm_banner2.png" alt="음성장터 바로가기"></a>
<a href=""><img src="./main/logo/btm_banner3.png" alt="음성명작페스티벌 바로가기"></a>
</div>
</section>
</main>
<!--푸터-->
<footer id="footer">
<div class="footer-box">
<div class="footer-logo">
<img src="./main/logo/footer_logo.png" alt="음성명작 페스티벌 로고">
</div>
<ul class="footer-sns">
<li><a><img src="./main/icon/sns_insta_on.png" alt="인스타그램 바로가기"></a></li>
<li><a><img src="./main/icon/sns_face_on.png" alt="인스타그램 바로가기"></a></li>
<li><a><img src="./main/icon/sns_blog_on.png" alt="인스타그램 바로가기"></a></li>
<li><a><img src="./main/icon/sns_youtube_on.png" alt="인스타그램 바로가기"></a></li>
</ul>
<div class="footer-text">
<span><strong>음성명작페스티벌 사업단</strong></span>
<span>충청북도 음성군 음성읍 반기문로 27 2층</span>
<span>사업자등록번호 : 308-82-73169 | 대표자 : 조용주</span>
<span>Copyright ⓒ2020 EUMSEONG MYEONGJAK. ALL RIGHTS RESERVED.</span>
</div>
<div class="call-num">
<h1>대표전화</h1>
<p><strong>043-873-8940</strong></p>
<p>09:00 ~ 18:00 토·일요일·공휴일 휴무</p>
</div>
</div>
</footer>
<script src="https://cdn.jsdelivr.net/npm/swiper@8/swiper-bundle.min.js"></script>
<script src="https://unpkg.com/aos@2.3.1/dist/aos.js"></script>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
var swiper = new Swiper(".mySwiper", {
direction: 'horizontal',
loop: true,
speed: 1000,
autoplay: {
delay: 2000,
},
setWrapperSize: true,
autoHeight: true,
pagination: {
el: ".swiper-pagination",
clickable: true,
type: "bullets"
},
breakpoints: { //반응형 조건 속성
320: { //640 이상일 경우
slidesPerView: 1, //레이아웃 2열
},
}
});
var swiper = new Swiper(".bot-swiper", {
direction: 'horizontal',
pagination: false,
loop: true,
speed: 1000,
autoplay: {
delay: 2000,
},
navigation: {
nextEl: '.bot-swiper-button-next',
prevEl: '.bot-swiper-button-prev',
},
breakpoints: { //반응형 조건 속성
426: { //640 이상일 경우
slidesPerView: 2.2, //레이아웃 2열
},
320: { //640 이상일 경우
slidesPerView: 1, //레이아웃 2열
},
}
});
</script>
<script>
$(document).ready(function () {
$(".notice-text").each(() => {
var length = 16;
$(this).each(() => {
if ($(this).text().length >= length) {
$(this).text($(this).text().substr(0, length) + '...');
}
})
})
$(".toggle-btn").click(() => {
$(".m-menu-box").toggleClass("hide")
})
$(".notice").removeClass("notice-fade-out")
$(".notice").addClass("notice-fade-in")
const bannerFn = function () {
$(".banner a").each((index, item) => {
$(item).removeClass(`notice-banner-animation${index}-off`)
$(item).addClass(`notice-banner-animation${index}-on`)
})
}
setTimeout(bannerFn, 500)
})
$(window).resize(function() {
if ($(this).width() >= 426) {
$(".m-menu-box").addClass("hide")
}else if($(this).width() < 426) {
console.log("작음");
$(".m-menu-box").addClass("hide")
}
})
</script>
<script>
const navScroll = document.querySelector("#scroll-nav");
const navSns = document.querySelectorAll("#nav .gnb-sns .gnb-sns-item")
const arryNavSns = Array.from(navSns)
const scrollNavSns = document.querySelectorAll("#scroll-nav .gnb-sns .gnb-sns-item")
const arryScrollNavSns = Array.from(scrollNavSns)
const snsKind = ['insta', 'face', 'blog', 'youtube']
const ON = "on"
const OFF = "off"
// SNS 호버 이벤트
const snsBg = (listArray)=>{
if(listArray) {
listArray.forEach((element, index, array)=>{
element.style.background = `url('./main/icon/sns_${snsKind[index]}_${OFF}.png') no-repeat`
})
}
}
const mouseEnter = (listArray)=>{
listArray.forEach((element, index, array)=>{
element.addEventListener('mouseenter', ()=>{
element.style.background = `url('./main/icon/sns_${snsKind[index]}_${ON}.png') no-repeat`
})
})
}
const mouseLeave = (listArray)=>{
listArray.forEach((element, index, array)=>{
element.addEventListener('mouseleave', ()=>{
element.style.background = `url('./main/icon/sns_${snsKind[index]}_${OFF}.png') no-repeat`
})
})
}
snsBg(arryNavSns)
mouseEnter(arryNavSns)
mouseLeave(arryNavSns)
snsBg(arryScrollNavSns)
mouseEnter(arryScrollNavSns)
mouseLeave(arryScrollNavSns)
const scrollNavFn = () => {
let Y = document.documentElement.scrollTop
if (Y >= 300) {
navScroll.classList.add("fixed")
navScroll.classList.remove("hide")
} else {
navScroll.classList.remove("fixed")
navScroll.classList.add("hide")
}
}
const scrollBotSliderFn = () => {
let Y = document.documentElement.scrollTop
const botSliderSec = document.querySelector(".bot-slider-sec")
const allianceSec = document.querySelector(".alliance-sec")
const botSliderSecH = document.querySelector(".bot-slider-sec").scrollHeight
if (Y >= botSliderSecH) {
botSliderSec.classList.remove("bot-slider-fade-out")
botSliderSec.classList.add("bot-slider-fade-in")
allianceSec.classList.remove("bot-slider-fade-out")
allianceSec.classList.add("bot-slider-fade-in")
} else {
botSliderSec.classList.remove("bot-slider-fade-in")
botSliderSec.classList.add("bot-slider-fade-out")
allianceSec.classList.remove("bot-slider-fade-in")
allianceSec.classList.add("bot-slider-fade-out")
}
}
const scrollFn = () => {
scrollNavFn()
scrollBotSliderFn()
}
document.addEventListener("scroll", scrollFn)
</script>
</body>
</html>
Write Preview
Loading…
Cancel
Save