De promotiewebsite die de reguliere site vervangt tijdens de Kick-In. https://join.harambee.utwente.nl
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
kick-in-promo-site/tests/index.html

440 lines
20 KiB

<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="http://code.jquery.com/qunit/qunit-1.18.0.css">
<meta charset="utf-8">
<title>fullpage.js - Tests</title>
<link rel="stylesheet" type="text/css" href="../src/fullpage.css" />
<style>
#qunit-fixture{
}
.fullpage-layout{
display: none;
}
.fullpage-layout.active{
display: block;
}
#menu{
position:fixed;
top:0;
left:0;
height: 40px;
z-index: 70;
width: 100%;
padding: 0;
margin:0;
}
.normalscroll{
overflow: scroll;
height: 300px;
}
.normalScroll h1{
font-size: 50px;
}
.content{
height: 1400px;
}
</style>
</head>
<body>
<div id="qunit"></div>
<div id="qunit-fixture">
<ul id="menu">
<li data-menuanchor="page1"><a href="#page1">One</a></li>
<li data-menuanchor="page2"><a href="#page2">Two</a></li>
<li data-menuanchor="page3"><a href="#page3">Three</a></li>
<li data-menuanchor="page4"><a href="#page4">Four</a></li>
</ul>
<div id="fullpage" class="fullpage-layout">
<div class="section" id="section1">Some section</div>
<div class="section" id="section2" style="background-color: blue;">
<div class="slide"> Slide 1 </div>
<div class="slide"> Slide 2 </div>
<div class="slide"> Slide 3 </div>
<div class="slide"> Slide 4 </div>
</div>
<div class="section" id="section3">Some section</div>
<div class="section" id="section4">Some section</div>
</div>
<div id="fullpage-slides-with-anchor" class="fullpage-layout">
<div class="section" id="section1">Some section</div>
<div class="section" id="section2" style="background-color: blue;">
<div class="slide" data-anchor="slide1"> Slide 1 </div>
<div class="slide" data-anchor="slide2"> Slide 2 </div>
<div class="slide" data-anchor="slide3"> Slide 3 </div>
<div class="slide" data-anchor="slide4"> Slide 4 </div>
</div>
<div class="section" id="section3">Some section</div>
<div class="section" id="section4">Some section</div>
</div>
<div id="fullpage-sections-and-slides-with-data-anchor" class="fullpage-layout">
<div class="section" data-anchor="page1" id="section1">Some section</div>
<div class="section" data-anchor="page2" id="section2" style="background-color: blue;">
<div class="slide" data-anchor="slide1"> Slide 1 </div>
<div class="slide" data-anchor="slide2"> Slide 2 </div>
<div class="slide" data-anchor="slide3"> Slide 3 </div>
<div class="slide" data-anchor="slide4"> Slide 4 </div>
</div>
<div class="section" data-anchor="page3" id="section3">Some section</div>
<div class="section" data-anchor="page4" id="section4">Some section</div>
</div>
<div id="fullpage-moveSlideRight" class="fullpage-layout">
<div class="section" id="section2">
<div class="slide" id="slide-1-1" data-anchor="slide1"> Slide 1 </div>
<div class="slide" id="slide-1-2" data-anchor="slide2"> Slide 2 </div>
<div class="slide" id="slide-1-3" data-anchor="slide3"> Slide 3 </div>
<div class="slide" id="slide-1-4" data-anchor="slide4"> Slide 4 </div>
</div>
<div class="section" id="section3">Some section</div>
<div class="section" id="section4">Some section</div>
</div>
<div id="fullpage-moveSlideLeft" class="fullpage-layout">
<div class="section" id="section2">
<div class="slide" id="slide-1-1"> Slide 1 </div>
<div class="slide" id="slide-1-2"> Slide 2 </div>
<div class="slide" id="slide-1-3"> Slide 3 </div>
<div class="slide active" id="slide-1-4"> Slide 4 </div>
</div>
<div class="section" id="section3">Some section</div>
<div class="section" id="section4">Some section</div>
</div>
<div id="fullpage-single-slide" class="fullpage-layout">
<div class="section" id="section1">
<div class="slide" id="slide-1-1"> Slide 1 </div>
</div>
<div class="section" id="section2">Some section</div>
<div class="section" id="section3">Some section</div>
</div>
<div id="fullpage-single-slide-in-second-section" class="fullpage-layout">
<div class="section" id="section1">Some section</div>
<div class="section" id="section2">
<div class="slide" id="slide-2-1"> Slide 1 </div>
</div>
<div class="section" id="section3">Some section</div>
</div>
<!-- Active slide in 1st section active -->
<div id="fullpage-second-slide-active" class="fullpage-layout">
<div class="section" id="section2">
<div class="slide" id="slide-1-1"> Slide 1 </div>
<div class="slide active" id="slide-1-2"> Slide 1 </div>
</div>
<div class="section" id="section3">Some section</div>
<div class="section" id="section4">Some section</div>
</div>
<div id="fullpage-middle-slide-active" class="fullpage-layout">
<div class="section" id="section1">
<div class="slide" id="slide-1-1"> Slide 1 </div>
<div class="slide active" id="slide-1-2"> Slide 1 </div>
<div class="slide" id="slide-1-3"> Slide 3 </div>
</div>
<div class="section" id="section3">Some section</div>
<div class="section" id="section4">Some section</div>
</div>
<div id="fullpage-first-slide-active" class="fullpage-layout">
<div class="section" id="section2">
<div class="slide active" id="slide-1-1"> Slide 1 </div>
<div class="slide" id="slide-1-2"> Slide 1 </div>
</div>
<div class="section" id="section3">Some section</div>
<div class="section" id="section4">Some section</div>
</div>
<!-- End Active slide in second section active -->
<!-- Active slide in second active section -->
<div id="fullpage-first-slide-active-in-2nd-section" class="fullpage-layout">
<div class="section" id="section1">Some section</div>
<div class="section" id="section2">
<div class="slide active" id="slide-1-1"> Slide 1 </div>
<div class="slide" id="slide-1-2"> Slide 1 </div>
</div>
<div class="section" id="section3">Some section</div>
<div class="section" id="section4">Some section</div>
</div>
<div id="fullpage-middle-slide-active-in-2nd-section" class="fullpage-layout">
<div class="section" id="section1">Some section</div>
<div class="section" id="section2">
<div class="slide" id="slide-1-1"> Slide 1 </div>
<div class="slide active" id="slide-1-2"> Slide 2 </div>
<div class="slide" id="slide-1-3"> Slide 3 </div>
</div>
<div class="section" id="section3">Some section</div>
<div class="section" id="section4">Some section</div>
</div>
<!-- End Active slide in second section active -->
<!-- Second section active -->
<div id="fullpage-2nd-active-section" class="fullpage-layout">
<div class="section" id="section1">Some section</div>
<div class="section active" id="section2">Some section</div>
<div class="section" id="section3">Some section</div>
<div class="section" id="section4">Some section</div>
</div>
<div id="fullpage-first-slide-active-in-2nd-active-section" class="fullpage-layout">
<div class="section" id="section1">Some section</div>
<div class="section active" id="section2">
<div class="slide active" id="slide-1-1"> Slide 1 </div>
<div class="slide" id="slide-1-2"> Slide 2 </div>
<div class="slide" id="slide-1-3"> Slide 3 </div>
</div>
<div class="section" id="section3">Some section</div>
<div class="section" id="section4">Some section</div>
</div>
<div id="fullpage-middle-slide-active-in-2nd-active-section" class="fullpage-layout">
<div class="section" id="section1">Some section</div>
<div class="section active" id="section2">
<div class="slide" id="slide-1-1"> Slide 1 </div>
<div class="slide active" id="slide-1-2"> Slide 2 </div>
<div class="slide" id="slide-1-3"> Slide 3 </div>
</div>
<div class="section" id="section3">Some section</div>
<div class="section" id="section4">Some section</div>
</div>
<div id="fullpage-sigle-slide-active-in-2nd-active-section" class="fullpage-layout">
<div class="section" id="section1">Some section</div>
<div class="section active" id="section2">
<div class="slide" id="slide-2-1"> Slide 1 </div>
</div>
<div class="section" id="section3">Some section</div>
</div>
<!-- End Second section active -->
<!-- 4th section active -->
<div id="fullpage-last-section-active" class="fullpage-layout">
<div class="section" id="section1">Some section</div>
<div class="section" id="section2">
<div class="slide" id="slide-1-1"> Slide 1 </div>
<div class="slide" id="slide-1-2"> Slide 2 </div>
<div class="slide" id="slide-1-3"> Slide 3 </div>
</div>
<div class="section" id="section3">Some section</div>
<div class="section active" id="section4">Some section</div>
</div>
<!-- End 4th section active -->
<div id="fullpage-all-sections-with-slides" class="fullpage-layout">
<div class="section" id="section1">
<div class="slide" id="slide-1-1"> Slide 1 </div>
<div class="slide" id="slide-1-2"> Slide 1 </div>
</div>
<div class="section" id="section2">
<div class="slide" id="slide-2-1"> Slide 1 </div>
<div class="slide" id="slide-2-2"> Slide 1 </div>
</div>
<div class="section" id="section3">
<div class="slide" id="slide-3-1"> Slide 1 </div>
<div class="slide" id="slide-3-2"> Slide 1 </div>
</div>
</div>
<div id="fullpage-no-slides" class="fullpage-layout">
<div class="section" id="section1">Some section</div>
<div class="section" id="section2">Some section</div>
<div class="section" id="section3">Some section</div>
<div class="section" id="section4">Some section</div>
</div>
<div id="fullpage-with-name-element" class="fullpage-layout">
<div class="section" id="section1">Some section</div>
<div class="section" id="section2"><a name="anchor-as-name" />Some section</div>
<div class="section" id="section3">Some section</div>
<div class="section" id="section4">Some section</div>
</div>
<div id="fullpage-with-id-element" class="fullpage-layout">
<div class="section" id="section1">Some section</div>
<div class="section" id="section2"><a id="anchor-as-id" href="">Some section</a></div>
<div class="section" id="section3">Some section</div>
<div class="section" id="section4">Some section</div>
</div>
<div id="fullpage-nav-tooltips" class="fullpage-layout">
<div class="section" id="section1" data-tooltip="demo1">Some section</div>
<div class="section" id="section2" data-tooltip="demo2">Some section</div>
<div class="section" id="section3" data-tooltip="demo3">Some section</div>
<div class="section" id="section4" data-tooltip="demo4">Some section</div>
</div>
<div id="fullpage-normalscrollelements" class="fullpage-layout">
<div class="section" id="section1">
<div class="title">Section 1</div>
<div class="normalscroll">
<h1>Test</h1><h1>Test</h1><h1>Test</h1><h1>Test</h1>
<h1>Test</h1><h1>Test</h1><h1>Test</h1><h1>Test</h1>
<h1>Test</h1><h1>Test</h1><h1>Test</h1><h1>Test</h1>
<h1>Test</h1><h1>Test</h1><h1>Test</h1><h1>Test</h1>
</div>
</div>
<div class="section" id="section2">Some section</div>
<div class="section" id="section3">Some section</div>
<div class="section" id="section4">Some section</div>
</div>
<div id="fullpage-auto-height" class="fullpage-layout">
<div class="section" id="section1">Some section</div>
<div class="section fp-auto-height" id="section2">
<div class="slide"><div class="content">Slide 1</div></div>
<div class="slide"><div class="content">Slide 2</div></div>
<div class="slide"><div class="content">Slide 3</div></div>
<div class="slide"><div class="content">Slide 4</div></div>
</div>
<div class="section fp-auto-height" id="section3"><div class="content">Some section</div></div>
<div class="section fp-auto-height" id="section4"><div class="content">Some section</div></div>
</div>
<div id="fullpage-custom-selector" class="fullpage-layout">
<div class="custom-section-selector" id="section1">Some section</div>
<div class="custom-section-selector fp-auto-height" id="section2">
<div class="slide">Slide 1</div>
<div class="slide">Slide 2</div>
<div class="slide">Slide 3</div>
<div class="slide">Slide 4</div>
</div>
<div class="custom-section-selector fp-auto-height" id="section3"><div class="content">Some section</div></div>
<div class="custom-section-selector fp-auto-height" id="section4"><div class="content">Some section</div></div>
</div>
<div id="fullpage-custom-slide-selector" class="fullpage-layout">
<div class="section" id="section1">Some section</div>
<div class="section fp-auto-height" id="section2">
<div class="custom-slide-selector">Slide 1</div>
<div class="custom-slide-selector">Slide 2</div>
<div class="custom-slide-selector">Slide 3</div>
<div class="custom-slide-selector">Slide 4</div>
</div>
<div class="section fp-auto-height" id="section3"><div class="content">Some section</div></div>
<div class="section fp-auto-height" id="section4"><div class="content">Some section</div></div>
</div>
<div id="fullpage-multiple-selectors" class="fullpage-layout">
<div class="selector1" id="section1" data-anchor="page1">Some section</div>
<div class="section" id="section2" data-anchor="page2">
<div class="custom-slide-selector">Slide 1</div>
<div class="custom-slide-selector">Slide 2</div>
<div class="custom-slide-selector">Slide 3</div>
</div>
<div class="selector1" id="section3" data-anchor="page3"><div class="content">Some section</div></div>
<div class="section" id="section4" data-anchor="page4"><div class="content">Some section</div></div>
</div>
</div>
<script
src="https://code.jquery.com/jquery-3.3.1.min.js"
integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
crossorigin="anonymous"></script>
<script type="text/javascript" src="https://code.jquery.com/qunit/qunit-2.5.1.js"></script>
<script type="text/javascript" src="../src/fullpage.js"></script>
<script type="text/javascript">
</script>
<script type="text/javascript" src="utils.js"></script>
<!--
//done
<script type="text/javascript" src="./unit/setAutoScrolling.js"></script>
<script type="text/javascript" src="./unit/moveSectionDown.js"></script>
<script type="text/javascript" src="./unit/moveSectionUp.js"></script>
<script type="text/javascript" src="./unit/callbacks.js"></script>
<script type="text/javascript" src="./unit/callbacksV3.js"></script>
<script type="text/javascript" src="./unit/moveSlideLeft.js"></script>
<script type="text/javascript" src="./unit/moveSlideRight.js"></script>
<script type="text/javascript" src="./unit/lazyload.js"></script>
<script type="text/javascript" src="./unit/arrows.js"></script>
<script type="text/javascript" src="./unit/destroy.js"></script>
<script type="text/javascript" src="./unit/displayWarnings.js"></script>
<script type="text/javascript" src="./unit/loopTop.js"></script>
<script type="text/javascript" src="./unit/loopBottom.js"></script>
<script type="text/javascript" src="./unit/lockAnchors.js"></script>
<script type="text/javascript" src="./unit/menu.js"></script>
<script type="text/javascript" src="./unit/nav.js"></script>
<script type="text/javascript" src="./unit/silentMoveTo.js"></script>
<script type="text/javascript" src="./unit/moveTo.js"></script>
<script type="text/javascript" src="./unit/scrollingSpeed.js"></script>
<script type="text/javascript" src="./unit/setAllowScrolling.js"></script>
<script type="text/javascript" src="./unit/keyboardScrolling.js"></script>
<script type="text/javascript" src="./unit/slidesNavigation.js"></script>
<script type="text/javascript" src="./unit/scrollBar.js"></script>
<script type="text/javascript" src="./unit/easingcss3.js"></script>
<script type="text/javascript" src="./unit/continuousVertical.js"></script>
<script type="text/javascript" src="./unit/normalScrollElements.js"></script>
<script type="text/javascript" src="./unit/verticalCentered.js"></script>
<script type="text/javascript" src="./unit/sectionsColor.js"></script>
<script type="text/javascript" src="./unit/paddings.js"></script>
<script type="text/javascript" src="./unit/selectors.js"></script>
<script type="text/javascript" src="./unit/fitToSection.js"></script>
<script type="text/javascript" src="./unit/responsiveWidth.js"></script>
<script type="text/javascript" src="./unit/responsiveHeight.js"></script>
<script type="text/javascript" src="./unit/fixedElements.js"></script>
//todo
<script type="text/javascript" src="./unit/recordHistory.js"></script>
<script type="text/javascript" src="./unit/reBuild.js"></script>
<script type="text/javascript" src="./unit/scrollOverflow.js"></script>
-->
<script type="text/javascript" src="./unit/setAutoScrolling.js"></script>
<script type="text/javascript" src="./unit/moveSectionDown.js"></script>
<script type="text/javascript" src="./unit/moveSectionUp.js"></script>
<script type="text/javascript" src="./unit/callbacks.js"></script>
<script type="text/javascript" src="./unit/callbacksV3.js"></script>
<script type="text/javascript" src="./unit/moveSlideLeft.js"></script>
<script type="text/javascript" src="./unit/moveSlideRight.js"></script>
<script type="text/javascript" src="./unit/lazyload.js"></script>
<script type="text/javascript" src="./unit/arrows.js"></script>
<script type="text/javascript" src="./unit/destroy.js"></script>
<script type="text/javascript" src="./unit/displayWarnings.js"></script>
<script type="text/javascript" src="./unit/loopTop.js"></script>
<script type="text/javascript" src="./unit/loopBottom.js"></script>
<script type="text/javascript" src="./unit/lockAnchors.js"></script>
<script type="text/javascript" src="./unit/menu.js"></script>
<script type="text/javascript" src="./unit/nav.js"></script>
<script type="text/javascript" src="./unit/silentMoveTo.js"></script>
<script type="text/javascript" src="./unit/moveTo.js"></script>
<script type="text/javascript" src="./unit/scrollingSpeed.js"></script>
<script type="text/javascript" src="./unit/setAllowScrolling.js"></script>
<script type="text/javascript" src="./unit/keyboardScrolling.js"></script>
<script type="text/javascript" src="./unit/slidesNavigation.js"></script>
<script type="text/javascript" src="./unit/scrollBar.js"></script>
<script type="text/javascript" src="./unit/easingcss3.js"></script>
<script type="text/javascript" src="./unit/continuousVertical.js"></script>
<script type="text/javascript" src="./unit/normalScrollElements.js"></script>
<script type="text/javascript" src="./unit/verticalCentered.js"></script>
<script type="text/javascript" src="./unit/sectionsColor.js"></script>
<script type="text/javascript" src="./unit/paddings.js"></script>
<script type="text/javascript" src="./unit/selectors.js"></script>
<script type="text/javascript" src="./unit/fitToSection.js"></script>
<script type="text/javascript" src="./unit/responsiveWidth.js"></script>
<script type="text/javascript" src="./unit/responsiveHeight.js"></script>
<script type="text/javascript" src="./unit/fixedElements.js"></script>
</body>
</html>