A Pen by Tosh

Developer
Tosh
Size
2,586 Kb
Views
20,230

How do I make an a pen by tosh?

What is a a pen by tosh? How do you make a a pen by tosh? This script and codes were developed by Tosh on 13 September 2022, Tuesday.

A Pen by Tosh Previews
IQ Test

A Pen by Tosh - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>A Pen by Tosh</title> <link rel="stylesheet" href="css/style.css">
</head>
<body> <div class="container">
<div class="skull-head"> <div class="skull-eyes"></div> <div class="skull-eyes"></div> <div class="skull-nose"></div> <div class="skull-tooth"></div> <div class="skull-tooth"></div> <div class="skull-tooth"></div> <div class="scream-container"> <div class="scream">AAAAAAAAAAAAA</div> </div>
</div>
</div>
</body>
</html>

A Pen by Tosh - Script Codes CSS Codes

.container { background: #20c4f4; margin: 0 auto; padding: 100px; width: 300px; height: 300px; display: inline-block; border-radius: 50%;
}
.skull-head { margin: 0 auto; background-color: white; height: 245px; width: 290px; border-radius: 50%; position: relative; text-align: center; -webkit-transition: 0.2s; transition: 0.2s;
}
.skull-head:hover { -webkit-transform: scale(0.85, 1); transform: scale(0.85, 1); -webkit-transform-origin: center; transform-origin: center;
}
.skull-head:hover .skull-eyes { -webkit-transform: scale(1.1, 1.2); transform: scale(1.1, 1.2);
}
.skull-head:hover .scream { opacity: 1; -webkit-animation: scream 0.3s linear; animation: scream 0.3s linear; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite;
}
.skull-eyes { background-color: #20c4f4; border-radius: 50%; width: 90px; height: 90px; display: inline-block; margin: 60px 8px 0 8px; -webkit-transition: 0.2s; transition: 0.2s;
}
.skull-nose { background-color: #20c4f4; width: 25px; height: 40px; border-radius: 50%; margin: 0 auto;
}
.skull-tooth { border-radius: 50%; background-color: white; width: 40px; height: 50px; display: inline-block; margin: 10px -2px 0 -2px;
}
.scream { text-align: center; display: block; margin: 30px; font-weight: bold; font-family: 'arial', sans-serif; font-size: 40px; color: #fff; -webkit-transform: scale(0); transform: scale(0); opacity: 0; -webkit-transition: 0.5s; transition: 0.5s;
}
.scream-container { width: 290px; overflow: hidden;
}
@-webkit-keyframes scream { 0% { -webkit-transform: translate(0px, 0px) scale(1); transform: translate(0px, 0px) scale(1); } 100% { -webkit-transform: translate(-86px, 0px) scale(1); transform: translate(-86px, 0px) scale(1); }
}
@keyframes scream { 0% { -webkit-transform: translate(0px, 0px) scale(1); transform: translate(0px, 0px) scale(1); } 100% { -webkit-transform: translate(-86px, 0px) scale(1); transform: translate(-86px, 0px) scale(1); }
}
A Pen by Tosh - Script Codes
A Pen by Tosh - Script Codes
Home Page Home
Developer Tosh
Username panev
Uploaded September 13, 2022
Rating 3
Size 2,586 Kb
Views 20,230
Do you need developer help for A Pen by Tosh?

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!

Tosh (panev) Script Codes
Name
D3mouse-test
Remove transitions and animation if the user has low battery
Communication
Dana vs. Todor Code Challenge Day 1
Inline elements are bad people.
Dana vs. Todor Code Challenge Day 3
Dana vs. Todor Code Challenge Day 2
Create amazing art & images 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!