"광주 문화예술 인문스토리 플랫폼"의 두 판 사이의 차이
광주문화예술인문스토리플랫폼
| 2번째 줄: | 2번째 줄: | ||
<html> | <html> | ||
| − | + | <style> | |
| + | section { | ||
| + | text-align: center; | ||
| + | font-size: 3em; | ||
| + | color: white; | ||
| + | } | ||
| + | .section1 { background: #1bbc9b; } | ||
| + | .section2 { background: #4BBFC3; } | ||
| + | .section3 { background: #7BAABE; } | ||
| + | .section4 { background: #f90; } | ||
| + | </style> | ||
| − | + | <div id="fullpage"> | |
| + | <div class="section section1">Section 1</div> | ||
| + | <div class="section section2">Section 2</div> | ||
| + | <div class="section section3">Section 3</div> | ||
| + | <div class="section section4">Section 4</div> | ||
| + | </div> | ||
<style> | <style> | ||
| 50번째 줄: | 65번째 줄: | ||
<script> | <script> | ||
$(document).ready(function() { | $(document).ready(function() { | ||
| − | + | new fullpage('#fullpage', { | |
| − | + | // FullPage.js 옵션 설정 | |
| − | + | autoScrolling: true, | |
| − | + | scrollHorizontally: true, | |
| − | + | // 추가 옵션 설정 | |
| − | + | }); | |
| − | |||
| − | |||
}); | }); | ||
2024년 5월 26일 (일) 01:27 판
Section 1
Section 2
Section 3
Section 4