On Hover Spinning Text
How do I make an on hover spinning text?
A CSS transition is changing the color, text-shadow and the transform properties of the . What is a on hover spinning text? How do you make a on hover spinning text? This script and codes were developed by Oliver Pope on 22 November 2022, Tuesday.
On Hover Spinning Text - Script Codes HTML Codes
<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>On Hover Spinning Text</title> <link rel="stylesheet" href="css/style.css">
</head>
<body> <h1>Hello World!</h1>
</body>
</html>
On Hover Spinning Text - Script Codes CSS Codes
@import url(https://fonts.googleapis.com/css?family=Cantora+One);
body { background-color: #ecf0f1;
}
h1 { font-family: "Cantora One"; font-size: 5em; font-weight: 400; text-align: center; color: #3498db; text-shadow: 2px 1px #2980b9, 3px 2px #2980b9, 4px 3px #2980b9, 5px 4px #2980b9, 6px 5px #2980b9, 7px 6px #2980b9; transition: width 2s, height 2s, color 5s, text-shadow 2s; -webkit-transition: width 2s, height 2s, -webkit-transform 2s, color 2s, text-shadow 2s;
}
h1:hover {
transform:rotate(180deg);
-webkit-transform:rotate(180deg); /* Safari */ color: #e67e22; text-shadow: 2px 1px #d35400, 3px 2px #d35400, 4px 3px #d35400, 5px 4px #d35400, 6px 5px #d35400, 7px 6px #d35400;
}
Developer | Oliver Pope |
Username | owebboy |
Uploaded | November 22, 2022 |
Rating | 3 |
Size | 1,715 Kb |
Views | 12,144 |
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!
Name | Size |
Navigation Bar | 1,858 Kb |
Perspective | 1,956 Kb |
Countdown | 2,078 Kb |
Document Template | 2,090 Kb |
Blog Article | 2,322 Kb |
Animated 3D Text | 1,792 Kb |
Le Hotel de Fancy | 1,907 Kb |
Control Panel | 2,399 Kb |
Tweeting Happy Birthday | 2,714 Kb |
A Pen by Oliver Pope | 2,120 Kb |
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!
Name | Username | Size |
Sidebar Thing | Jonambas | 2,779 Kb |
Resume | Rottingroom | 5,483 Kb |
No Vacancy 404 CSS Only | Sethkontny | 0 Kb |
Placeholder support for contentEditable elements, without JavaScript | Flesler | 1,863 Kb |
Rows with image hover effect | Amit-webdesigner | 12,875 Kb |
Wikipedia Viewer | Codinger | 4,681 Kb |
JS Countdown Timer | Ayoungh | 2,435 Kb |
Custom Select Element | Agrayson | 3,616 Kb |
A Pen by boilzzz | Boilzzz | 2,761 Kb |
Google Chrome Icon using Pure CSS in one DIV | Grssam | 3,627 Kb |
Surf anonymously, prevent hackers from acquiring your IP address, send anonymous email, and encrypt your Internet connection. High speed, ultra secure, and easy to use. Instant setup. Hide Your IP Now!