Game-Jaming/Frontend/Html/ShowCase.html

86 lines
4.1 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title></title>
<link rel="stylesheet" href="../Styles/ShowCase.css" />
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-BmbxuPwQa2lc/FVzBcNJ7UAyJxM6wuqIj61tLrc4wSX0szH/Ev+nYRRuWlolflfl" crossorigin="anonymous">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.2/css/all.min.css" integrity="sha512-HK5fgLBL+xu6dm/Ii3z4xhlSUyZgTT9tuc/hSrtw6uzJOvgRr2a9jyxxT1ely+B+xFAmJKVSTbpM/CuL7qxO8w==" crossorigin="anonymous" />
<link rel="stylesheet" href="../Styles/jcarousel.responsive.css" />
<!-- CSS end -->
<!-- Header scripts -->
<script src="https://code.jquery.com/jquery-3.6.0.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script>
<script src="../Javascript/jcarousel.responsive.js"></script>
<script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/jcarousel@0.3.9/dist/jquery.jcarousel.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/jcarousel@0.3.9/dist/jquery.jcarousel.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.6.0/dist/umd/popper.min.js" integrity="sha384-KsvD1yqQ1/1+IA7gi3P0tyJcT3vR+NdBTt13hSJ2lnve8agRGXTTyNaBYmCR/Nwi" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0-beta2/dist/js/bootstrap.min.js" integrity="sha384-nsg8ua9HAw1y0W1btsyWgBklPnCUAFLuTMS2G72MMONqmOymq585AcH49TLBQObG" crossorigin="anonymous"></script>
<!-- Header scripts end -->
</head>
<body>
<h1 id="gameTitle">Game Jam Name</h1>
<p id="groupId">Name Of Author</p>
<div>
<div class="row">
<div class="col-sm" id="description">
<b>Beskrivelse</b><br />
Yoooooooo my name is gert,
I love flowers.... HA what?
<br />
<button id="isWebBased">Play game online</button>
<button id="gameFil">Download game</button>
</div>
<div class="col-sm" id="thumbnailFile">
<img src="../Images/spil.jpg" />
</div>
</div>
</div>
<hr class="GradientDivider" />
<p>Måske vil du prøve...</p>
<div class="jcarousel-wrapper">
<div class="jcarousel" data-jcarousel="true">
<ul style="left: 0px; top: 0px;">
<li style="width: 200px;"><a href="#link"><img src="../Images/spil.jpg" alt="Image 1"></a></li>
<li style="width: 200px;"><a href="#link"><img src="../Images/spil.jpg" alt="Image 2"></a></li>
<li style="width: 200px;"><a href="#link"><img src="../Images/spil.jpg" alt="Image 3"></a></li>
<li style="width: 200px;"><a href="#link"><img src="../Images/spil.jpg" alt="Image 4"></a></li>
<li style="width: 200px;"><a href="#link"><img src="../Images/spil.jpg" alt="Image 5"></a></li>
<li style="width: 200px;"><a href="#link"><img src="../Images/spil.jpg" alt="Image 6"></a></li>
</ul>
</div>
<a href="#" class="jcarousel-control-prev" data-jcarouselcontrol="true"></a>
<a href="#" class="jcarousel-control-next" data-jcarouselcontrol="true"></a>
<p class="jcarousel-pagination" data-jcarouselpagination="true">
<a href="#1" class="active">1</a>
<a href="#2">2</a>
<a href="#3">3</a>
<a href="#4">4</a>
<a href="#5">5</a>
<a href="#6">6</a>
</p>
</div>
<script>
$(function () {
$('.jcarousel').jcarousel();
});
$('.jcarousel-control-prev').click(function () {
$('.jcarousel').jcarousel('scroll', '-=1');
});
$('.jcarousel-control-next').click(function () {
$('.jcarousel').jcarousel('scroll', '+=1');
});
</script>
</body>
</html>