A Pen by Jarad Light
How do I make an a pen by jarad light?
What is a a pen by jarad light? How do you make a a pen by jarad light? This script and codes were developed by Jarad Light on 09 October 2022, Sunday.
A Pen by Jarad Light - Script Codes HTML Codes
<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>A Pen by Jarad Light</title> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/5.0.0/normalize.min.css"> <link rel="stylesheet" href="css/style.css">
</head>
<body> <table> <tr> <th></th> <th>Atk</th> <th>Spd</th> <th>Def</th> <th>Hp</th> <th>SA</th> <th>SD</th> </tr> <tr> <th>Slot 1</th> <td class="stat"></td> <td class="stat"></td> <td class="stat"></td> <td class="stat"></td> <td class="stat"></td> <td class="stat"></td> </tr> <tr> <th>Slot 2</th> <td class="stat"></td> <td class="stat"></td> <td class="stat"></td> <td class="stat"></td> <td class="stat"></td> <td class="stat"></td> </tr> <tr> <th>Slot 3</th> <td class="stat"></td> <td class="stat"></td> <td class="stat"></td> <td class="stat"></td> <td class="stat"></td> <td class="stat"></td> </tr> <tr> <th>Slot 4</th> <td class="stat"></td> <td class="stat"></td> <td class="stat"></td> <td class="stat"></td> <td class="stat"></td> <td class="stat"></td> </tr> <tr> <th>Slot 5</th> <td class="stat"></td> <td class="stat"></td> <td class="stat"></td> <td class="stat"></td> <td class="stat"></td> <td class="stat"></td> </tr> <tr> <th>Slot 6</th> <td class="stat"></td> <td class="stat"></td> <td class="stat"></td> <td class="stat"></td> <td class="stat"></td> <td class="stat"></td> </tr>
</table>
<button class="clear">Clear!</button>
<br />
<br />
<br />
<br />
<br />
<div class="pokemon"> <ul class="stats"> <li class="health"></li> <li class="attack"></li> <li class="defence"></li> <li class="sattack"></li> <li class="sdefence"></li> <li class="speed"></li> </ul>
</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 Jarad Light - Script Codes CSS Codes
th, td { padding: 5px;
}
td { border: 1px solid black; width: 30px; height: 30px; margin: 3px; cursor: pointer;
}
td:hover { border-color: red;
}
.stat.good { background-color: orange;
}
.stat.max { background-color: green;
}
.stat.zero { background-color: red;
}
.stat.ignore { background-color: grey;
}
A Pen by Jarad Light - Script Codes JS Codes
$().ready(function(){ $('.stat').mousedown(function(event) { switch (event.which) { case 1: if($(this).hasClass('good')){ $(this).removeClass('good'); $(this).addClass('max'); } else if ($(this).hasClass('max')){ $(this).removeClass('max'); $(this).addClass('zero'); } else if($(this).hasClass('zero')){ $(this).removeClass('zero'); } else { $(this).addClass('good'); } break; case 2: //$(this).removeClass(); break; case 3: //$(this).removeClass(); break; default: alert('You have a strange mouse'); } }); $('.clear').click(function(){ $('.stat').each(function(){ $(this).removeClass(); $(this).addClass('stat'); }); }); $('th').click(function(){ $(this).siblings('td').each(function(){ $(this).addClass('ignore'); }); });
});
Developer | Jarad Light |
Username | jaradlight |
Uploaded | October 09, 2022 |
Rating | 3 |
Size | 2,453 Kb |
Views | 16,192 |
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 |
Simple Menu | 2,790 Kb |
Sass Placeholder Stuff | 1,751 Kb |
Input File behaviours | 2,550 Kb |
Loading Bar | 2,333 Kb |
Animated Checkboxes | 2,911 Kb |
Dropdown styles | 2,097 Kb |
RPG Tool | 3,422 Kb |
Map Location Hover demo | 3,439 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 |
Sticky menu on scroll | Senff | 2,869 Kb |
Portfolio Layout Flex | Lahvjal | 3,489 Kb |
CSS Link Icons with jQuery Titles | Nicwinn | 2,312 Kb |
Draggables in pure angular | Rlo206 | 5,167 Kb |
Touch Carousel - last, no gaps. | Berkin | 4,332 Kb |
Contact | GanNichiHa | 2,514 Kb |
Canvas Fireworks | Jackrugile | 6,200 Kb |
CSS3 Animated buttons | Cguillou | 3,737 Kb |
Another brick in the wall | Fivera | 1,955 Kb |
Velocity.js custom stagger | Tommiehansen | 4,805 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!