- 掃描 ID:
- 5182b728-d6b1-4032-80c7-29d7097c0682已完成
- 已提交的 URL:
- https://tf2.particleshub.com/
- 報告完成時間:
連結 · 找到 23 個
從頁面中識別的傳出連結
連結 | Text |
---|---|
https://teamfortress.com | |
https://steamcommunity.com/profiles/76561198138014202 | -=NHS=- Kwas |
https://steamcommunity.com/profiles/76561198197081327 | bamboo |
https://steamcommunity.com/profiles/76561198865269690 | boba |
https://steamcommunity.com/profiles/76561198027738883 | Bonk Nickeltoon |
https://steamcommunity.com/profiles/76561199094219345 | Chikamae` |
https://steamcommunity.com/profiles/76561198045327094 | Kerpongle |
https://steamcommunity.com/profiles/76561198079133635 | Pritter30 |
https://steamcommunity.com/profiles/76561198029585558 | Sera486 |
https://steamcommunity.com/profiles/76561199175400163 | default |
JavaScript 變數 · 找到 8 個
在頁面的視窗物件上載入的全域 JavaScript 變數是在函數外部宣告的變數,可從目前範圍內程式碼中的任何位置存取
名稱 | 類型 |
---|---|
onbeforetoggle | object |
documentPictureInPicture | object |
onscrollend | object |
r | function |
Jt | function |
n | object |
t | function |
Splide | function |
主控台記錄訊息 · 找到 0 條
記錄到 Web 主控台的訊息
HTML
頁面的原始 HTML 主體
<!DOCTYPE html><html lang="en"><head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta property="og:title" content="Pаrticle Mаyhem 2 - Tеam Fortress 2 Cоntest">
<meta property="og:type" content="game">
<meta property="og:url" content="https://tf2.particleshub.com/">
<meta property="og:image" content="https://tf2.particleshub.com/images/share.jpeg">
<meta property="og:site_name" content="https://tf2.particleshub.com ">
<meta property="og:description" content="Welcome to the TF2 Mаyhem! Immerse yourself in this lively, community-driven event where TF2 fans come together to showcase and create new in-game effects.">
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="
https://cdn.jsdelivr.net/npm/@splidejs/[email protected]/dist/css/splide.min.css
" rel="stylesheet">
<link rel="shortcut icon" href="./assets/favicon.ico">
<title>Pаrticle Mаyhem 2 - Tеam Fortress 2 Cоntest</title>
<style>
@import url("https://fonts.googleapis.com/css2?family=Lexend+Deca:[email protected]&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Caveat:[email protected]&display=swap");
body {
margin: 0;
background-color: black;
min-width: 1100px;
font-family: Arial, Helvetica, sans-serif;
}
.wrapper {
margin: 0 auto;
position: relative;
}
.header {
background-image: url("./assets/header-bg.jpg");
background-repeat: no-repeat;
background-position: center top;
margin: 0 auto;
}
.header-content {
position: relative;
width: 1100px;
height: 1150px;
padding-top: 50px;
margin: 0 auto;
}
.logo {
position: absolute;
left: 400px;
top: 29px;
}
.logo-img {
filter: drop-shadow(0px 5px 5px rgba(0, 0, 0, 0.5));
max-height: 67px;
width: 300px;
object-fit: cover;
pointer-events: none;
}
.logo-video {
width: 1100px;
}
.time {
background-image: url("./assets/time.jpg");
background-repeat: no-repeat;
background-position: center top;
margin: 0 auto;
}
.time-content {
margin: 0 auto;
padding-top: 450px;
width: 780px;
height: 650px;
}
.time-text {
color: black;
font-family: "Lexend Deca", sans-serif;
line-height: 30px;
margin: 0px 0px 29px 0px;
font-size: 18px;
text-shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
}
.prize {
background-image: url("./assets/prize.jpg");
background-repeat: no-repeat;
background-position: center top;
}
.prize-content {
width: 800px;
height: 725px;
margin: 0 auto;
}
.prize-pools {
padding-top: 272px;
padding-left: 95px;
transform: rotate(8deg);
text-align: center;
float: left;
}
.prize-pools-header {
width: 340px;
line-height: 24px;
text-shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
margin: 0px 0px 45px 0px;
padding: 0;
font-size: 40px;
text-decoration: underline;
font-family: Caveat, Arial, Helvetica, sans-serif;
}
.prize-pools-keys {
width: 340px;
line-height: 32px;
text-shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
margin: 0px 0px 35px 0px;
padding: 0;
font-size: 60px;
text-decoration: underline;
font-family: Caveat, Arial, Helvetica, sans-serif;
}
.prize-pools-text {
width: 340px;
line-height: 24px;
text-shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
margin: 0px 0px 20px 0px;
padding: 0;
font-size: 32px;
font-family: Caveat, Arial, Helvetica, sans-serif;
}
.prize-pools-text span {
text-decoration: underline;
font-size: 28px;
}
.prize-desc {
padding-top: 230px;
padding-right: 175px;
width: 160px;
height: 324px;
float: right;
}
.prize-desc-text {
font-family: Lexend Deca, Arial, Helvetica, sans-serif;
font-size: 18px;
line-height: 24px;
text-shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
margin: 0px 0px 15px 0px;
}
.prize-desc-text:last-child {
margin: 25px 0px 15px 0px;
}
.prize-contribute {
padding-right: 50px;
width: 285px;
float: right;
}
.prize-contribute-text {
font-family: Lexend Deca, Arial, Helvetica, sans-serif;
font-size: 18px;
line-height: 24px;
text-shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
margin: 0px 0px 15px 0px;
}
.prize-contribute-text a {
color: #3fdcc0;
text-shadow: 0 1px 2px rgba(0, 0, 0, 0.75);
}
.donors {
background-image: url("./assets/donor.jpg");
background-repeat: repeat-y;
background-position: center top;
}
.donors-content {
width: 800px;
padding-bottom: 50px;
margin: 0 auto;
text-align: center;
}
.donors-content-title {
text-align: center;
font-family: Lexend Deca, Arial, Helvetica, sans-serif;
color: #fff;
font-size: 18px;
line-height: 24px;
text-shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
margin: 0px 0px 15px 0px;
}
.donor {
background: rgba(0, 0, 0, 0.5);
border-radius: 5px;
color: #fff;
padding: 5px 8px;
font-size: 20px;
margin: 0 2px 4px;
display: inline-flex;
gap: 5px;
}
.donor-person {
color: #3fdcc0;
text-shadow: 0 1px 2px rgba(0, 0, 0, 0.75);
font-size: 20px;
}
.donor-amount {
margin: 0;
font-size: 20px;
}
.rules {
background-image: url("./assets/rule.jpg");
background-repeat: no-repeat;
background-position: center top;
}
.rules-content {
padding-top: 150px;
width: 800px;
height: 300px;
margin: 0 auto;
}
.rules-ul {
width: 780px;
padding-left: 20px;
}
.rules-li {
font-family: Lexend Deca, Arial, Helvetica, sans-serif;
color: #fff;
font-size: 18px;
line-height: 24px;
text-shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
margin-bottom: 10px;
}
.faq {
background-image: url("./assets/faq.jpg");
background-repeat: no-repeat;
background-position: center top;
}
.faq-content {
height: 1020px;
padding-top: 150px;
width: 800px;
margin: 0 auto;
}
.faq-questions {
font-family: Lexend Deca, Arial, Helvetica, sans-serif;
color: #fff;
font-size: 18px;
line-height: 24px;
text-shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
margin: 0px 0px 15px 0px;
text-decoration: underline;
font-weight: 400;
}
.faq-answer {
font-family: Lexend Deca, Arial, Helvetica, sans-serif;
color: #fff;
font-size: 18px;
line-height: 24px;
text-shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
font-weight: 400;
margin: 0px 0px 15px 0px;
}
.faq-answer a {
color: #3fdcc0;
}
.faq-answer a:hover {
text-shadow: 0 1px 2px rgba(0, 0, 0, 0.75), 0 0 5px currentColor;
}
.experiments {
background-position: center top;
background-repeat: no-repeat;
background-image: url("./assets/experiments.jpg");
}
.experiments-content {
position: relative;
height: 700px;
padding-top: 450px;
width: 950px;
margin: 0 auto;
}
.my-next-btn {
border: none;
font: inherit;
color: inherit;
background-color: transparent;
background-image: url("./assets/Right.png");
margin-right: 10px;
float: right;
width: 110px;
height: 156px;
margin-top: 73px;
cursor: pointer;
right: 0;
}
.my-next-btn:hover {
background-position: center;
}
.my-prev-btn {
border: none;
font: inherit;
color: inherit;
background-color: transparent;
background-image: url("./assets/Left.png");
margin-left: 10px;
float: left;
width: 110px;
height: 156px;
margin-top: 73px;
cursor: pointer;
left: 0;
}
.my-prev-btn,
.my-next-btn {
position: absolute;
top: 48%;
transform: translateY(-60%);
}
.my-prev-btn:hover {
background-position: center;
}
.item {
display: flex;
gap: 25px;
width: 690px;
margin: 0 auto;
}
.item-image {
width: 300px;
}
.item-image:hover {
filter: brightness(1.25);
}
.item-text {
font-family: Lexend Deca, Arial, Helvetica, sans-serif;
color: #fff;
font-size: 18px;
line-height: 24px;
text-shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
}
.item-info {
float: right;
}
#item-reverse {
flex-direction: row-reverse;
}
.experiments-disclaimer {
position: absolute;
top: 790px;
opacity: 0.3;
font-size: 13px;
text-align: center;
font-family: Lexend Deca, Arial, Helvetica, sans-serif;
color: #fff;
line-height: 24px;
text-shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
margin: 0;
width: 100%;
}
.links {
background-image: url("./assets/links.jpg");
background-position: center top;
background-repeat: no-repeat;
}
.links-content {
width: 800px;
padding-top: 50px;
height: 410px;
position: relative;
margin: 0 auto;
}
.links-image-a {
position: absolute;
top: 100px;
}
.links-image {
top: 100px;
width: 300px;
height: 300px;
transform: rotate(-3deg);
}
.links-image:hover {
filter: drop-shadow(0px 5px 5px rgba(0, 0, 0, 0.5)) brightness(1.25);
}
.links-social-img-discord {
display: block;
background-image: url("./assets/discord.png");
background-repeat: no-repeat;
width: 362px;
height: 134px;
right: 0;
margin-left: auto;
}
.links-social-img-discord:hover {
background-position: center;
}
.links-social-img-steam {
display: block;
background-image: url("./assets/steam.png");
background-repeat: no-repeat;
width: 298px;
height: 142px;
right: 0;
margin-left: auto;
}
.links-social-img-steam:hover {
background-position: center;
}
.links-social-img-workshop {
display: block;
background-image: url("./assets/workshop.png");
background-repeat: no-repeat;
width: 425px;
height: 134px;
right: 0;
margin-left: auto;
}
.links-social-img-workshop:hover {
background-position: center;
}
.credits {
background-image: url("./assets/credits.jpg");
background-position: center top;
background-repeat: no-repeat;
}
.credits-content {
height: 810px;
padding-top: 450px;
width: 950px;
margin: 0 auto;
}
.credits-content-image {
position: relative;
margin-left: 8px;
width: 90px;
height: 90px;
display: inline-block;
}
.credits-content-image-a {
max-width: 90px;
height: 90px;
position: relative;
text-decoration: none;
}
.credits-content-image-a::after {
position: absolute;
content: "";
width: 90px;
height: 90px;
background-image: url("./assets/creditsOverlay.png");
right: 4px;
}
#creditsImagePosition::after {
right: 0px;
}
#creditsImagePosition {
margin-left: 226px;
}
.credits-content-image-a:hover {
filter: brightness(1.25);
}
#creditsImage {
margin-left: 225px;
}
.credits-content-image-block {
position: relative;
margin: 0 0 15px 0px;
}
#creditsImageBody {
margin-top: 72px;
}
.credits-content-image-block-last {
margin-left: 164px;
width: 620px;
}
.credits-icons-text {
display: inline-block;
font-family: Lexend Deca, Arial, Helvetica, sans-serif;
color: #fff;
font-size: 18px;
line-height: 24px;
text-shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
}
.footer {
background-image: url("./assets/footer.jpg");
background-position: center top;
background-repeat: no-repeat;
}
.footer-content {
padding-top: 110px;
width: 950px;
height: 740px;
margin: 0 auto;
}
.footer-wrapper {
display: flex;
align-items: center;
justify-content: space-between;
}
.footer-valve-logo {
width: 101px;
height: 30px;
background-image: url("./assets/logoValve.png");
}
.footer-valve-logo:hover {
background-position: bottom;
}
.footer-copText {
width: 801px;
height: 60px;
display: flex;
align-items: center;
right: 16px;
font-size: 12px;
text-shadow: 0 0 10px #000;
color: #a5a5a5;
}
</style>
</head>
<body>
<section class="header wrapper">
<div class="header-content">
<a class="logo" href="https://teamfortress.com">
<img class="logo-img" src="./assets/logoT-F.png" alt="">
</a>
<video class="logo-video" autoplay="" loop="" muted="" playsinline="" src="./assets/logo-video.webm"></video>
</div>
</section>
<section class="time wrapper">
<div class="time-content">
<p class="time-text">
Discovery! A word teeming with limitless potential. What does it mean
to truly <i>discover</i>? Since the dawn of civilization, humans have
pursued the unknown. Thousands of years ago, our ancestors discovered
fire. In 1876, Alexander Bell discovered the telephone.
</p>
<p class="time-text">
At Particle Mayhem, we're about more than just fire and phones. Today,
we're thrilled to announce we've decoded one of the cosmos' profound
mysteries. Some said it was unreachable. To them, we say: nonsense!
What do you understand about science!?
</p>
<p class="time-text">
That's right, fellow particle enthusiasts. We're transcending time and
space!
</p>
<p class="time-text">
Not only will we venture into the cosmos, but we'll shatter the
barriers of time itself! The most exciting part is... YOU are again
tasked with crafting experiments! Can your creations endure time or
brave Jupiter’s storms? Will they time-travel and revolutionize
Ancient Egypt? <u>Anything is possible!</u>
</p>
</div>
</section>
<section class="prize wrapper">
<div class="prize-content">
<div class="prize-pools">
<p class="prize-pools-header">Prize Pool</p>
<p class="prize-pools-keys">444 Keys</p>
<p class="prize-pools-text">1st place (3 cats): <span>~20%</span></p>
<p class="prize-pools-text">2nd place (3 cats): <span>~15%</span></p>
<p class="prize-pools-text">3rd place (3 cats): <span>~10%</span></p>
<p class="prize-pools-text">
Honorable mentions (x5): <span>~5%</span>
</p>
</div>
<div class="prize-desc">
<p class="prize-desc-text">
This time, our leading experiments have the chance to secure an
<u>expanding Key surplus</u>.
</p>
<p class="prize-desc-text">
The ultimate prize pool has now reached an impressive
<u>444 Keys</u>
</p>
</div>
<div class="prize-contribute">
<p class="prize-contribute-text">
interested in contributing? Have more questions? Check out the
<a href="#FAQ">FAQ</a> below!
</p>
</div>
</div>
</section>
<section id="donors" class="donors wrapper">
<div class="donors-content">
<p class="donors-content-title">Gratitude to our donors:</p>
<div class="donor">
<a class="donor-person" href="https://steamcommunity.com/profiles/76561198138014202">-=NHS=- Kwas
</a>
<p class="donor-amount">- 350 Keys</p>
</div>
<div class="donor">
<a class="donor-person" href="https://steamcommunity.com/profiles/76561198197081327">bamboo
</a>
<p class="donor-amount">- 50 Keys</p>
</div>
<div class="donor">
<a class="donor-person" href="https://steamcommunity.com/profiles/76561198865269690">boba</a>
<p class="donor-amount">- 65 Keys</p>
</div>
<div class="donor">
<a class="donor-person" href="https://steamcommunity.com/profiles/76561198027738883">Bonk Nickeltoon</a>
<p class="donor-amount">- 20 Keys</p>
</div>
<div class="donor">
<a class="donor-person" href="https://steamcommunity.com/profiles/76561199094219345">Chikamae`
</a>
<p class="donor-amount">- 8 Keys</p>
</div>
<div class="donor">
<a class="donor-person" href="https://steamcommunity.com/profiles/76561198045327094">Kerpongle</a>
<p class="donor-amount">- 10 Keys</p>
</div>
<div class="donor">
<a class="donor-person" href="https://steamcommunity.com/profiles/76561198079133635">Pritter30</a>
<p class="donor-amount">- 25 Keys</p>
</div>
<div class="donor">
<a class="donor-person" href="https://steamcommunity.com/profiles/76561198029585558">Sera486</a>
<p class="donor-amount">- 40 Keys</p>
</div>
<div class="donor">
<a class="donor-person" href="https://steamcommunity.com/profiles/76561199175400163">default</a>
<p class="donor-amount">- 9 Keys</p>
</div>
</div>
</section>
<section class="rules wrapper">
<div class="rules-content">
<ul class="rules-ul">
<li class="rules-li">
All submissions must be uploaded to the TF2 Steam Workshop by the
deadline of <u>December 31st, 2023, at 12am UTC.</u>
</li>
<li class="rules-li">
The contest revolves around the intriguing themes of
<u>time <i>and</i> space</u>! Participants are encouraged to submit
any particle effect, item, or war paint that aligns with these
themes.
</li>
<li class="rules-li">
You are allowed to use concept art and sprites that were created
prior to the contest. However, any other pre-existing materials are
not eligible for submission.
</li>
<li class="rules-li">
Staff members are not permitted to compete in the contest. They may
submit entries, but these will neither be judged nor eligible for
placement. Additionally, items already featured on this site are not
eligible for the contest.
</li>
</ul>
</div>
</section>
<section id="FAQ" class="faq wrapper">
<div class="faq-content">
<div class="faq-block">
<h3 class="faq-questions">What is Particle Mayhem 2?</h3>
<h4 class="faq-answer">
Particle Mayhem 2 is a community-driven contest organized by
enthusiastic members of the Team Fortress 2 community. We are
calling on time travelers and astronauts from around the globe to
create the most extraordinary Steam Workshop submissions imaginable!
Join us in making this contest a cosmic success!
</h4>
</div>
<div class="faq-block">
<h3 class="faq-questions">
Is this an official update for Team Fortress 2?
</h3>
<h4 class="faq-answer">
No, this is not an official update. This is a community-initiated
project and is not directly affiliated with Valve. This means that
submissions to the contest have no guarantee of being officially
added to the game.
</h4>
</div>
<div class="faq-block">
<h3 class="faq-questions">
What can I submit, and what can't I submit?
</h3>
<h4 class="faq-answer">
You can submit cosmetics, war paints, and, of course, particles!
These item types are all eligible as long as they align with the
time and space theme of the contest. Please refrain from submitting
anything that violates the contest rules.
</h4>
</div>
<div class="faq-block">
<h3 class="faq-questions">
Last time you mentioned medals. What's the deal?
</h3>
<h4 class="faq-answer">
In 2019, Valve quietly stopped accepting new community-made medals
due to oversaturation and high demand.
</h4>
<h4 class="faq-answer">
Unfortunately, the original medals created for the first event were
not implemented before this change, and we are unsure if Valve will
add new medals in the future. We apologize for any inconvenience
this may cause.
</h4>
</div>
<div class="faq-block">
<h3 class="faq-questions">
How do the prizes work? Can I contribute?
</h3>
<h4 class="faq-answer">
We are kicking off the contest's prize pool with a total of 100 Mann
Co. Keys, which will be divided into three categories: particles,
cosmetics, and war paints. The keys will be equally distributed
among all contributors of a winning submission.
</h4>
<h4 class="faq-answer">
Donations are now closed. We extend our gratitude to all
<a href="#donors">donors</a> who helped increase the prize pool to
such an impressive number of Keys!
</h4>
</div>
</div>
</section>
<section class="experiments wrapper">
<div class="experiments-content">
<div id="image-carousel" class="splide splide--loop splide--ltr splide--draggable is-active is-overflow is-initialized" aria-label="Beautiful Images" role="region" aria-roledescription="carousel">
<div class="splide__track splide__track--loop splide__track--ltr splide__track--draggable" id="image-carousel-track" style="padding-left: 0px; padding-right: 0px;" aria-live="off" aria-atomic="true">
<ul class="splide__list" id="image-carousel-list" role="presentation" style="transform: translateX(-1900px);">
<li class="splide__slide splide__slide--clone" id="image-carousel-clone01" role="group" aria-roledescription="slide" aria-label="7 of 8" style="width: calc(100%);" aria-hidden="true">
<div class="item">
<a href="sign" target="_blank" draggable="false" tabindex="-1">
<img class="item-image" src="./assets/itemthumb7.png" draggable="false">
</a>
<div class="item-info">
<img src="./assets/itemtitle7.png" draggable="false">
<p class="item-text">
Our latest development in time-travel technology! This
state-of-the-art canteen was made to send those annoying
killer robots to other time periods, out of sight and
mind! What's that? Every world leader is a robot now? What
a ridiculous—ALL GLORY TO THE ROBOT OVERLORDS.
</p>
</div>
</div>
</li><li class="splide__slide splide__slide--clone is-prev" id="image-carousel-clone02" role="group" aria-roledescription="slide" aria-label="8 of 8" style="width: calc(100%);" aria-hidden="true">
<div id="item-reverse" class="item">
<a href="sign" target="_blank" draggable="false" tabindex="-1">
<img class="item-image" src="./assets/itemthumb8.png" draggable="false">
</a>
<div class="item-info">
<img src="./assets/itemtitle8.png" draggable="false">
<p class="item-text">
Oddly enough, this wasn't part of our experiments. We were
cleaning out a former employee's desk and found spray cans
full of an unknown, circuit-like substance. We did the
logical thing and sprayed it on guns. You know, for
science.
</p>
</div>
</div>
</li><li class="splide__slide is-active is-visible" id="image-carousel-slide01" role="group" aria-roledescription="slide" aria-label="1 of 8" style="width: calc(100%);">
<div class="item">
<a href="sign" draggable="false">
<img class="item-image" src="images/itemthumb1.png" draggable="false">
</a>
<div class="item-info">
<img src="images/itemtitle1.png" draggable="false">
<p class="item-text">
The "Malibu Sunset" effect in TF2 turns the hat into a stunning beach sunrise scene, with vibrant colors and a prominent palm tree, evoking a serene and tropical atmosphere.
</p>
</div>
</div>
</li>
<li class="splide__slide is-next" id="image-carousel-slide02" role="group" aria-roledescription="slide" aria-label="2 of 8" style="width: calc(100%);" aria-hidden="true">
<div id="item-reverse" class="item">
<a href="sign" draggable="false" tabindex="-1">
<img class="item-image" src="./assets/itemthumb2.png" draggable="false">
</a>
<div class="item-info">
<img src="./assets/itemtitle2.png" draggable="false">
<p class="item-text">
Circular teleportation? DULL! Hexagonal teleportation?
Already patented. Teleport in STYLE with our new
triangular method! Don't be a square (because that's
patented too) and try it today!
</p>
</div>
</div>
</li>
<li class="splide__slide" id="image-carousel-slide03" role="group" aria-roledescription="slide" aria-label="3 of 8" style="width: calc(100%);" aria-hidden="true">
<div class="item">
<a href="sign" target="_blank" draggable="false" tabindex="-1">
<img class="item-image" src="./assets/itemthumb3.png" draggable="false">
</a>
<div class="item-info">
<img src="./assets/itemtitle3.png" draggable="false">
<p class="item-text">
Congratulations! You thought a massive supercollider would
be the best place for a game of hide-and-seek! You were
right, as you now have the ability to endlessly float
through your own timestream! All it cost you was lifelong
bone rattling syndrome.
</p>
</div>
</div>
</li>
<li class="splide__slide" id="image-carousel-slide04" role="group" aria-roledescription="slide" aria-label="4 of 8" style="width: calc(100%);" aria-hidden="true">
<div id="item-reverse" class="item">
<a href="sign" target="_blank" draggable="false" tabindex="-1">
<img class="item-image" src="./assets/itemthumb4.png" draggable="false">
</a>
<div class="item-info">
<img src="./assets/itemtitle4.png" draggable="false">
<p class="item-text">
What happens when you decrease the pressure of a thousand
stars at once? An unstoppable, ever-emitting Supernova!
Perfect for destroying classified documents, and maybe one
or two interns.
</p>
</div>
</div>
</li>
<li class="splide__slide" id="image-carousel-slide05" role="group" aria-roledescription="slide" aria-label="5 of 8" style="width: calc(100%);" aria-hidden="true">
<div class="item">
<a href="sign" target="_blank" draggable="false" tabindex="-1">
<img class="item-image" src="./assets/itemthumb5.png" draggable="false">
</a>
<div class="item-info">
<img src="./assets/itemtitle5.png" draggable="false">
<p class="item-text">
Want to look your best while facing the horrors of space?
Look no further! We removed the excess skull fragments
from this one for maximum comfort. Perfect for long
strolls on the Moon!
</p>
</div>
</div>
</li>
<li class="splide__slide" id="image-carousel-slide06" role="group" aria-roledescription="slide" aria-label="6 of 8" style="width: calc(100%);" aria-hidden="true">
<div id="item-reverse" class="item">
<a href="sign" target="_blank" draggable="false" tabindex="-1">
<img class="item-image" src="./assets/itemthumb6.png" draggable="false">
</a>
<div class="item-info">
<img src="./assets/itemtitle6.png" draggable="false">
<p class="item-text">
This little fellow has been a great help in the lab.
Tasked with carrying out experiments and shooting our
scientists' evil time-traveling doppelgangers (with a 50%
success rate), the SP-13 is ready for the world beyond!
</p>
</div>
</div>
</li>
<li class="splide__slide" id="image-carousel-slide07" role="group" aria-roledescription="slide" aria-label="7 of 8" style="width: calc(100%);" aria-hidden="true">
<div class="item">
<a href="sign" target="_blank" draggable="false" tabindex="-1">
<img class="item-image" src="./assets/itemthumb7.png" draggable="false">
</a>
<div class="item-info">
<img src="./assets/itemtitle7.png" draggable="false">
<p class="item-text">
Our latest development in time-travel technology! This
state-of-the-art canteen was made to send those annoying
killer robots to other time periods, out of sight and
mind! What's that? Every world leader is a robot now? What
a ridiculous—ALL GLORY TO THE ROBOT OVERLORDS.
</p>
</div>
</div>
</li>
<li class="splide__slide" id="image-carousel-slide08" role="group" aria-roledescription="slide" aria-label="8 of 8" style="width: calc(100%);" aria-hidden="true">
<div id="item-reverse" class="item">
<a href="sign" target="_blank" draggable="false" tabindex="-1">
<img class="item-image" src="./assets/itemthumb8.png" draggable="false">
</a>
<div class="item-info">
<img src="./assets/itemtitle8.png" draggable="false">
<p class="item-text">
Oddly enough, this wasn't part of our experiments. We were
cleaning out a former employee's desk and found spray cans
full of an unknown, circuit-like substance. We did the
logical thing and sprayed it on guns. You know, for
science.
</p>
</div>
</div>
</li>
<li class="splide__slide splide__slide--clone is-active" id="image-carousel-clone03" role="group" aria-roledescription="slide" aria-label="1 of 8" style="width: calc(100%);" aria-hidden="true">
<div class="item">
<a href="sign" draggable="false" tabindex="-1">
<img class="item-image" src="images/itemthumb1.png" draggable="false">
</a>
<div class="item-info">
<img src="images/itemtitle1.png" draggable="false">
<p class="item-text">
The "Malibu Sunset" effect in TF2 turns the hat into a stunning beach sunrise scene, with vibrant colors and a prominent palm tree, evoking a serene and tropical atmosphere.
</p>
</div>
</div>
</li><li class="splide__slide splide__slide--clone" id="image-carousel-clone04" role="group" aria-roledescription="slide" aria-label="2 of 8" style="width: calc(100%);" aria-hidden="true">
<div id="item-reverse" class="item">
<a href="sign" draggable="false" tabindex="-1">
<img class="item-image" src="./assets/itemthumb2.png" draggable="false">
</a>
<div class="item-info">
<img src="./assets/itemtitle2.png" draggable="false">
<p class="item-text">
Circular teleportation? DULL! Hexagonal teleportation?
Already patented. Teleport in STYLE with our new
triangular method! Don't be a square (because that's
patented too) and try it today!
</p>
</div>
</div>
</li></ul>
</div>
</div>
<button id="my-prev-btn" class="my-prev-btn"></button>
<button id="my-next-btn" class="my-next-btn"></button>
<p class="experiments-disclaimer">
</p>
</div>
</section>
<section class="links wrapper">
<div class="links-content">
<a class="links-image-a" href="downloads/thumbnail.png">
<img class="links-image" src="./assets/thumbnail.png" alt="">
</a>
<div class="links-social">
<a class="links-social-img-discord" href="https://discord.gg/g9sPRXJgPA">
</a>
<a class="links-social-img-steam" href="https://steamcommunity.com/groups/ParticleMayhem">
</a>
<a class="links-social-img-workshop" href="https://steamcommunity.com/sharedfiles/filedetails/?id=3038415270">
</a>
</div>
</div>
</section>
<section class="credits wrapper">
<div class="credits-content">
<div class="credits-content-image-block">
<a class="credits-content-image-a" href="https://steamcommunity.com/profiles/76561198027738883">
<img class="credits-content-image" src="./assets/creditsBonk.png" alt="">
</a>
<a id="creditsImage" class="credits-content-image-a" href="https://steamcommunity.com/profiles/76561198043892001">
<img class="credits-content-image" src="./assets/creditsMuhai.png" alt="">
</a>
<a id="creditsImagePosition" class="credits-content-image-a" href="https://steamcommunity.com/profiles/76561198071260200">
<img class="credits-content-image" src="./assets/creditsProper.png" alt="">
</a>
</div>
<div id="creditsImageBody" class="credits-content-image-block">
<a class="credits-content-image-a" href="https://steamcommunity.com/profiles/76561198066916585">
<img class="credits-content-image" src="./assets/creditsCheesy.png" alt="">
</a>
<a id="creditsImage" class="credits-content-image-a" href="https://steamcommunity.com/profiles/76561198078856258">
<img class="credits-content-image" src="./assets/creditsLettuce.png" alt="">
</a>
<a id="creditsImagePosition" class="credits-content-image-a" href="https://steamcommunity.com/profiles/76561198040588557">
<img class="credits-content-image" src="./assets/creditsLazer.png" alt="">
</a>
</div>
<div id="creditsImageBody" class="credits-content-image-block">
<a class="credits-content-image-a" href="https://steamcommunity.com/profiles/76561198127379171">
<img class="credits-content-image" src="./assets/creditsFeksil.png" alt="">
</a>
<a id="creditsImage" class="credits-content-image-a" href="https://steamcommunity.com/profiles/76561198038963425">
<img class="credits-content-image" src="./assets/creditsDansky.png" alt="">
</a>
<a id="creditsImagePosition" class="credits-content-image-a" href="https://steamcommunity.com/profiles/76561198178926899">
<img class="credits-content-image" src="./assets/creditsFancy.png" alt="">
</a>
</div>
<div id="creditsImageBody" class="credits-content-image-block credits-content-image-block-last">
<a class="credits-content-image-a" href="https://steamcommunity.com/profiles/76561198043050514">
<img class="credits-content-image" src="./assets/creditsLight.png" alt="">
</a>
<a id="creditsImagePosition" class="credits-content-image-a" href="https://steamcommunity.com/profiles/76561198865269690">
<img class="credits-content-image" src="./assets/creditsBoba.png" alt="">
</a>
</div>
<p style="margin-left: 140px; margin-top: 71px" class="credits-icons-text">
Director
</p>
<p style="margin-left: 140px; margin-top: 71px" class="credits-icons-text">
Particles
</p>
<p style="margin-left: 136px; margin-top: 71px" class="credits-icons-text">
Artist
</p>
<p style="margin-left: 160px; margin-top: 71px" class="credits-icons-text">
Modeler
</p>
<p style="margin-left: 248px; margin-top: 28px" class="credits-icons-text">
SFM Artist
</p>
<p style="margin-left: 120px; margin-top: 28px" class="credits-icons-text">
Writer
</p>
<p style="margin-left: 156px; margin-top: 28px" class="credits-icons-text">
Webdev
</p>
</div>
</section>
<section class="footer wrapper">
<div class="footer-content">
<div class="footer-wrapper">
<a class="footer-valve-logo" href="https://www.valvesoftware.com/">
</a>
<p class="footer-copText">
© 2022-2024 Valve Corporation, all rights reserved.
</p>
</div>
</div>
</section>
<script src="https://cdn.jsdelivr.net/npm/@splidejs/[email protected]/dist/js/splide.min.js"></script>
<script>
document.addEventListener("DOMContentLoaded", function () {
const splide = new Splide("#image-carousel", {
type: "loop",
perPage: 1,
pagination: false,
arrows: false,
autoplay: true,
interval: 7000,
}).mount();
document
.getElementById("my-prev-btn")
.addEventListener("click", function () {
splide.go("<");
});
document
.getElementById("my-next-btn")
.addEventListener("click", function () {
splide.go(">");
});
document.querySelectorAll('a[href^="#"').forEach((link) => {
link.addEventListener("click", function (e) {
e.preventDefault();
let href = this.getAttribute("href").substring(1);
const scrollTarget = document.getElementById(href);
const topOffset = 0;
const elementPosition = scrollTarget.getBoundingClientRect().top;
const offsetPosition = elementPosition - topOffset;
window.scrollBy({
top: offsetPosition,
behavior: "smooth",
});
});
});
});
</script>
</body></html>