A Pen by Petri Pottonen

Developer
Petri Pottonen
Size
33,168 Kb
Views
60,720
  1. A Pen by Petri Pottonen Previews
  2. A Pen by Petri Pottonen HTML Codes
  3. A Pen by Petri Pottonen CSS Codes
  4. A Pen by Petri Pottonen JS Codes

How do I make an a pen by petri pottonen?

What is a a pen by petri pottonen? How do you make a a pen by petri pottonen? This script and codes were developed by Petri Pottonen on 21 August 2022, Sunday.

A Pen by Petri Pottonen Previews
IQ Test

A Pen by Petri Pottonen - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>A Pen by Petri Pottonen</title> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/meyer-reset/2.0/reset.min.css"> <link rel="stylesheet" href="css/style.css">
</head>
<body> <section>
<div class="message from-me">
<p>Moikka</p>
<div id="maskDivRight" ></div>
</div>
<div class="clear"></div>
<div class="message from-them">
<p>Mitkä jatkot ? :D</p>
<div id="maskDivLeft" ></div>
</div>
<div class="clear"></div>
<div class="message from-me">
<p>Ollaan teijän teltal darrajengin kaa</p>
</div>
<div class="clear"></div>
<div class="message from-them">
<p>Älä viiti ihan lame</p>
</div>
<div class="clear"></div>
<div class="message from-me">
<p>Juom kaljaa parvekkeella ja ootan emäntää</p>
<div id="maskDivRight" ></div>
</div>
<div class="clear"></div>
<div class="message from-them">
<p>syksy lyö</p>
<div id="maskDivLeft" ></div>
</div>
<div class="clear"></div>
<div class="message from-me">
<p>Hei aika heikkoi teekkareita</p>
</div>
<div class="clear"></div>
<div class="message from-them">
<p>Hyi saatana!</p>
</div>
<div class="clear"></div>
<div class="message from-me">
<p>:D rakkautta ilmassa</p>
</div>
<div class="clear"></div>
<div class="message from-them">
<p>Toi jäbä on SPITAALINEN</p>
</div>
<div class="clear"></div>
<div class="message from-me">
<p>Hahahaha, heippa vaan, ei tuu ikävä!</p>
</div>
<div class="clear"></div>
<div class="message from-them">
<p>Mulla jatkot</p>
</div>
<div class="clear"></div>
<div class="message from-me">
<p>Ilmeisesti?</p>
</div>
<div class="clear"></div>
<div class="message from-them">
<p>On on</p>
</div>
<div class="clear"></div>
<div class="message from-me">
<p>Hyiiii saaatana</p>
</div>
</section>
<div class="nodisplay">
<svg> <defs> <clipPath id="maskRect1" > <path d="M20.0570197,0.159682367 C20.0570197,0.159682367 19.1831922,19.5443332 24.7408151,25.2801005 C27.0548105,28.6159844 32.8343286,32.1574423 37,33.8109007 C36.9875274,33.9287784 6.45008823,34.4720683 0.184018996,16.6219698 C-2.27160015,9.62666826 20.0570197,0.159682367 20.0570197,0.159682367 Z" id="vektori" fill="#1899FF" sketch:type="MSShapeGroup"></path> </clipPath> </defs> </svg> <svg > <defs> <clipPath id="maskRectleft" > <path d="M20.0570197,0.159682367 C20.0570197,0.159682367 19.1831922,19.5443332 24.7408151,25.2801005 C27.0548105,28.6159844 32.8343286,32.1574423 37,33.8109007 C36.9875274,33.9287784 6.45008823,34.4720683 0.184018996,16.6219698 C-2.27160015,9.62666826 20.0570197,0.159682367 20.0570197,0.159682367 Z" id="vektori" fill="#1899FF" sketch:type="MSShapeGroup" transform="translate(18.497683, 17.000000) scale(-1, 1) translate(-18.497683, -17.000000) "></path> </clipPath> </defs> </svg>
</div> <script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script> <script src="js/index.js"></script>
</body>
</html>

A Pen by Petri Pottonen - Script Codes CSS Codes

body { font-family: "Helvetica Neue"; font-size: 40px; font-weight: normal;
}
section { max-width: 900px; margin: 0 auto;
}
section > div { display: inline-block; max-width: 510px; word-wrap: break-word; margin-bottom: 40px; line-height: 48px;
}
.clear { clear: both; display: block;
}
.message { position: relative; padding: 20px 40px; border-radius: 40px;
}
.from-me { color: white; background: url("http://uxhelsinki.a2hosted.com/imessages/gradient-viiva.png") repeat fixed; background-size: 100% 100%; float: right;
}
.from-them { background: #E5E5EA; color: black; float: left;
}
#maskDivRight { position: absolute; bottom: -24px; right: -32px; width: 52px; height: 60px; background: url("http://uxhelsinki.a2hosted.com/imessages/gradient-viiva.png"); background-repeat: no-repeat; background-attachment: fixed; background-size: 100% 100%; -webkit-clip-path: url(#maskRect1); clip-path: url(#maskRect1); -webkit-transform: scale(1); transform: scale(1);
}
#maskDivLeft { position: absolute; bottom: -34px; left: -17px; width: 52px; height: 70px; background: #E5E5EA; -webkit-clip-path: url(#maskRectleft); clip-path: url(#maskRectleft); -webkit-transform: scale(1); transform: scale(1);
}
.nodisplay { height: 0 !important; overflow: hidden;
}
*::-webkit-scrollbar { width: 0 !important;
}

A Pen by Petri Pottonen - Script Codes JS Codes

var viestiArray = [
"Se levii ku syöpä",
"Haha",
"Huikee ilta",
"Miks???",
"Miks vitussa",
"
A Pen by Petri Pottonen - Script Codes
A Pen by Petri Pottonen - Script Codes
Home Page Home
Developer Petri Pottonen
Username ketri
Uploaded August 21, 2022
Rating 3
Size 33,168 Kb
Views 60,720
Do you need developer help for A Pen by Petri Pottonen?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

Petri Pottonen (ketri) Script Codes
Name
JM navi offcanvas
Infinite scrolling background
Squarespace translate five next and previous
Responsive typography example
Wrap last word in span
Mouseover image
Animated text background-image
Delay animation loop scss
Slidein portfolio without ajax
Outrun test 1
Create amazing Facebook ads with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!