A Pen by Kyle
How do I make an a pen by kyle?
What is a a pen by kyle? How do you make a a pen by kyle? This script and codes were developed by Kyle on 16 October 2022, Sunday.
A Pen by Kyle - Script Codes HTML Codes
<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>A Pen by Kyle</title> <link rel="stylesheet" href="css/style.css">
</head>
<body> <nav> <ul class="menu"> <li><a href="#" >Home</a></li> <li><a href="#" >About</a></li> <li><a href="#" >Design</a></li> <li><a href="#" >Community Benefits</a></li> <li class="current-menu-item"><a href="#" >Sustainability</a></li> </ul>
</nav> <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 Kyle - Script Codes CSS Codes
nav { height: 50px; text-align: center; text-transform: uppercase; background: #fff;
}
nav ul, nav ul li { margin: 0; padding: 0; list-style: none;
}
nav ul li { display: inline-block; *display: inline; zoom: 1; margin-right: 10px;
}
nav ul li a { display: block; line-height: 50px; padding: 0 20px; margin-right: 20px; color: #000; text-decoration: none; font-size: 22px;
}
nav ul li:last-of-type { margin-right: 0;
}
nav ul li a:hover { background-color: #dfdcda;
}
nav ul li.current-menu-item a{ background-color: #dfdcda; position: relative;
}
nav ul li.current-menu-item a:after { position: absolute; top:100%; left: 50%; content: ""; display: block; border-top: 10px solid #dfdcda; border-left: 20px solid transparent; border-right: 20px solid transparent; margin-left: -20px;
}
A Pen by Kyle - Script Codes JS Codes
$( ".menu li" ).click( function() { $( ".menu li" ).removeClass( "current-menu-item" ); $( this ).addClass( "current-menu-item" );
});
Developer | Kyle |
Username | kbrec85 |
Uploaded | October 16, 2022 |
Rating | 3 |
Size | 2,009 Kb |
Views | 18,216 |
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 |
Hyphen test | 2,562 Kb |
SIdebar for g and g idea | 2,793 Kb |
CSS3 Animation | 2,556 Kb |
A Pen by Kyle | 2,009 Kb |
HR styling for forums | 1,917 Kb |
Quilt Loader | 2,649 Kb |
Logo Round 1 | 2,423 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 |
03 - CSS Variables | Run-time | 2,682 Kb |
Lightning | Akm2 | 19,150 Kb |
Donald Trump - The New Yorker | Agbales | 2,502 Kb |
Pagepilling.js | Blossk | 6,554 Kb |
Right Click Menu | Anodpixels | 2,252 Kb |
Testing Portfolio Page | Sideshowli | 3,395 Kb |
RWD- Mostly Fluid Layout Pattern | Marcocastro | 2,312 Kb |
Twinkling Stars | Ripley6811 | 2,750 Kb |
SVG Text Masking | JMChristensen | 2,141 Kb |
Use the Twitchtv JSON API | Roksanaop | 3,561 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!