A Pen by Jay

Developer
Size
3,784 Kb
Views
8,092

How do I make an a pen by jay?

What is a a pen by jay? How do you make a a pen by jay? This script and codes were developed by Jay on 14 January 2023, Saturday.

A Pen by Jay Previews

A Pen by Jay - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>A Pen by Jay</title> <script src="https://s.codepen.io/assets/libs/modernizr.js" type="text/javascript"></script> <link rel='stylesheet prefetch' href='http://drgdaniel.com/public/default/resources/css/foundation.css'> <link rel="stylesheet" href="css/style.css">
</head>
<body> <!-- MOBILE MAIN MENU -->
<div class="mobileMainMenu" id="rightMenuPanel"> <ul class="side-nav"> <li class="navTitle"><span>Main Menu</span></li> <li class="has-dropdown"> <a href="#">About</a> <ul class="dropdown"> <li><a href="{url path="profile/index"}">Biography</a></li> <li><a href="{url path="aesthetic/index"}">Our Team</a></li> <li><a href="{url path="technology/index"}">Facilities</a></li> </ul> </li> <li class="has-dropdown"> <a href="#">Holistic Center</a> <ul class="dropdown"> <li><a href="{url path="education/index"}">What is Holistic?</a></li> <li><a href="{url path="cases/index"}">Dental Cases</a></li> </ul> </li> <li class="has-dropdown"> <a href="#">News &amp; Events</a> <ul class="dropdown"> <li><a href="{url path="news/index"}">News</a></li> <li><a href="{url path="events/index"}">Events</a></li> </ul> </li> <li><a href="{url path="services/index"}">Dental Treatments</a></li> <li><a href="{url path="contactUs/index"}">Contact Us</a></li> </ul>
</div>
<!-- END OF MOBILE MAIN MENU -->
<div class="body"> <!-- HEADER --> <div class="headerFixedWrapper"> <div class="headerWrapper first"> <nav class="top-bar" data-topbar> <ul class="title-area"> <li class="logoWrapper"> <a href="{url path="home/index"}" class="logo text-center"> <img src="{public_url path="images/logo.png"}" /> </a> </li> </ul> <section class="top-bar-section right hide-if-mobile"> <ul class="right"> <li><a href="https://facebook.com/{$clientConfig.facebook}"><i class="icon fb"></i></a></li> <li><a href="https://twitter.com/{$clientConfig.twitter}"><i class="icon twitter"></i></a></li> <li><a href="mailto:{$clientConfig.email}"><i class="icon email"></i></a></li> <li><a href="tel:{$clientConfig.phoneNumber}"><i class="icon phone"></i> {$clientConfig.phoneNumber}</a></li> <li><a href="{url path="contactUs/schedule"}" data-revealid="scheduleModal" data-manual-reveal class="buttonPractice">View Daily Practice</a></li> </ul> </section> <section class="top-bar-section right show-if-mobile"> <ul class="right"> <li class="text-center"><a href="#" id="btnRightPanel"><i class="icon view"></i></a></li> </ul> </section> </nav> </div> <div class="headerWrapper second hide-if-mobile"> <nav class="top-bar mainMenu" data-topbar> <section class="top-bar-section right"> <ul class="right"> {if empty($selectedMainMenu)}{$selectedMainMenu = ""}{/if} <li class="has-dropdown{if $selectedMainMenu == "about"} active{/if}"> <a href="#">About</a> <ul class="dropdown"> <li><a href="{url path="profile/index"}">Biography</a></li> <li><a href="{url path="aesthetic/index"}">Our Team</a></li> <li><a href="{url path="technology/index"}">Facilities</a></li> </ul> </li> <li class="has-dropdown{if $selectedMainMenu == "holistic"} active{/if}"> <a href="#">Holistic Center</a> <ul class="dropdown"> <li><a href="{url path="education/index"}">What is Holistic?</a></li> <li><a href="{url path="cases/index"}">Dental Cases</a></li> </ul> </li> <li class="has-dropdown{if $selectedMainMenu == "news"} active{/if}"> <a href="#">News &amp; Events</a> <ul class="dropdown"> <li><a href="{url path="news/index"}">News</a></li> <li><a href="{url path="events/index"}">Events</a></li> </ul> </li> <li class="{if $selectedMainMenu == "services"} active{/if}"><a href="{url path="services/index"}">Dental Treatments</a></li> <li class="{if $selectedMainMenu == "contact"} active{/if}"><a href="{url path="contactUs/index"}">Contact Us</a></li> </ul> </section> </nav> </div> </div> <!--END OF HEADER--> <!--CONTENT--> <div class="contentWrapper"> <!--page content--> {block name="content"}{/block} </div>
</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 Jay - Script Codes CSS Codes

nav.top-bar #btnRightPanel { width: 40px; height: 100%; display: inline-block; line-height: 40px;
}
.mobileMainMenu { position: fixed; top: 0; bottom: 0; right: 0; background: url('/images/bg-mobileMainMenu.jpg') repeat; width: 250px; z-index: 0;
}
.mobileMainMenu .side-nav { font-family: Arial; padding-top: 0;
}
.mobileMainMenu .side-nav .dropdown { list-style: none; padding: 0 0 0 30px; margin: 0; height: auto; max-height: 0; -moz-transition: all 0.5s; -o-transition: all 0.5s; -webkit-transition: all 0.5s; transition: all 0.5s; overflow: hidden;
}
.mobileMainMenu .side-nav .dropdown li { padding: 5px 0px 5px 15px;
}
.mobileMainMenu .side-nav .dropdown li a { padding: 0;
}
.mobileMainMenu .side-nav li * { color: #000; padding: 15px 25px; text-decoration: none;
}
.mobileMainMenu .side-nav li.navTitle { border-bottom: solid 1px #666; line-height: 40px; height: 40px; box-shadow: 0px 1px 0px #FFFFFF;
}
.mobileMainMenu .side-nav li.navTitle span { font-family: Arial; font-style: italic;
}
.mobileMainMenu .side-nav li.has-dropdown.active a { font-family: Arial;
}
.mobileMainMenu .side-nav li.has-dropdown.active ul { max-height: 1000px;
}

A Pen by Jay - Script Codes JS Codes

 $("#btnRightPanel").click(function(){ $(".body").toggleClass("shifted"); });
A Pen by Jay - Script Codes
A Pen by Jay - Script Codes
Home Page Home
Developer Jay
Username jaycode
Uploaded January 14, 2023
Rating 3
Size 3,784 Kb
Views 8,092
Do you need developer help for A Pen by Jay?

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!

Jay (jaycode) Script Codes
Create amazing web content 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!