janishutz-website/components
SHA256
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add components

Browse Source
This commit is contained in:
Janis Hutz
2025-09-29 11:24:36 +02:00
parent 6d1050c6cb
commit 620d4144b5
3748 changed files with 902194 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

34
slider/index.html Normal file
View File

@@ -0,0 +1,34 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Slider</title>
<style>
body, html {
margin: 0;
width: 100%;
height: 100%;
width: 100%;
padding: 0;
}
</style>
<link rel="stylesheet" href="/slider.css">
</head>
<body>
<h1>Sliders</h1>
<!-- Style the slider class with width, height and borders, don't touch the other classes, except for colours -->
<div class="slider" style="width: 100vw; height: 80vh;">
<div class="slider-container">
<div class="slider-element" style="background-image: url( 'https://store-cdn.janishutz.com/assets/promo-images/math-summaries-desktop.jpg' );"></div>
<div class="slider-element" style="background-image: url( 'https://store-cdn.janishutz.com/assets/promo-images/libreevent-desktop.jpg' );"></div>
<div class="slider-element" style="background-image: url( 'https://store-cdn.janishutz.com/assets/promo-images/donate-desktop.jpg' );"></div>
</div>
<div class="slider-controls slider-control-left" onclick="sliderControl( 'previous' )">&#11164;</div>
<div class="slider-controls slider-control-right" onclick="sliderControl( 'next' )">&#11166;</div>
</div>
<script src="/js/slider.js"></script>
<script>activateSlider( 5000 )</script>
</body>
</html>