"광주 문화예술 인문스토리 플랫폼"의 두 판 사이의 차이

광주문화예술인문스토리플랫폼
이동: 둘러보기, 검색
3번째 줄: 3번째 줄:
 
<html>  
 
<html>  
  
−
<div id="fullpage">
+
  <div class="boxwrap">
−
<div class="section" style="background:beige;"><p id="ppp_title" style="text-align:left;font-size:30px;       font-family: 'pyeonghwa' !important;">
+
    <div class="box" style="background-color:red;">1</div>
−
광주 문화예술 인문스토리 플랫폼은<br>
+
    <div class="box" style="background-color:orange;">2</div>
−
광주광역시에 산재한 문화예술자료와 근현대문화유적을 발견하고,<br>
+
    <div class="box" style="background-color:yellow;">3</div>
−
기록하는 디지털 데이터 아카이브 입니다.
+
    <div class="box" style="background-color:green;">4</div>
 +
    <div class="box" style="background-color:blue;">5</div>
 +
    <div class="box" style="background-color:indigo;">6</div>
 +
    <div class="box" style="background-color:violet;">7</div>
 +
    </div>
  
−
</p>
+
 
−
</div>
+
<script>
−
<div class="section">Some section</div>
+
      window.onload = function () {
−
<div class="section">Some section</div>
+
            var elm = ".box";
−
<div class="section">Some section</div>
+
            $(elm).each(function (index) {
−
</div>
+
                // 개별적으로 Wheel 이벤트 적용
 +
                $(this).on("mousewheel DOMMouseScroll", function (e) {
 +
                    e.preventDefault();
 +
                    var delta = 0;
 +
                    if (!event) event = window.event;
 +
                    if (event.wheelDelta) {
 +
                        delta = event.wheelDelta / 120;
 +
                        if (window.opera) delta = -delta;
 +
                    }
 +
                    else if (event.detail)
 +
                        delta = -event.detail / 3;
 +
                    var moveTop = $(window).scrollLeft();
 +
                    var elmSelecter = $(elm).eq(index);
 +
                    // 마우스휠을 위에서 아래로
 +
                    if (delta < 0) {
 +
                        if ($(elmSelecter).next() != undefined) {
 +
                            try{
 +
                                moveTop = $(elmSelecter).next().offset().left;
 +
                            }catch(e){}
 +
                        }
 +
                    // 마우스휠을 아래에서 위로
 +
                    } else {
 +
                        if ($(elmSelecter).prev() != undefined) {
 +
                            try{
 +
                                moveTop = $(elmSelecter).prev().offset().left;
 +
                            }catch(e){}
 +
                        }
 +
                    }
 +
                   
 +
                    // 화면 이동 0.8초(800)
 +
                    $("html,body").stop().animate({
 +
                        scrollLeft: moveTop + 'px'
 +
                    }, {
 +
                        duration: 800, complete: function () {
 +
                        }
 +
                    });
 +
                });
 +
            });
 +
        }
 +
</script>
 
<style>
 
<style>
 
.col-md-6 iframe
 
.col-md-6 iframe

2024년 5월 26일 (일) 01:25 판


1
2
3
4
5
6
7

원본 주소 "http://dh.aks.ac.kr/~gwangju/wiki/index.php?title=광주_문화예술_인문스토리_플랫폼&oldid=42931"