CaseXmode

Developer
Ben Song
Size
3,057 Kb
Views
18,216
  1. CaseXmode Previews
  2. CaseXmode HTML Codes
  3. CaseXmode CSS Codes

How do I make an casexmode?

What is a casexmode? How do you make a casexmode? This script and codes were developed by Ben Song on 05 November 2022, Saturday.

CaseXmode Previews
IQ Test

CaseXmode - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>caseXmode</title> <link rel="stylesheet" href="css/style.css">
</head>
<body> <nav> <div id="logo"> <img src="http://ninepanda.com/xmode/images/logo.png"></div> <label for="drop" class="navtoggle"><img src="https://cdn4.iconfinder.com/data/icons/wirecons-free-vector-icons/32/menu-alt-512.png" width="35px"></label> <input type="checkbox" id="drop" /> <ul class="menu"> <li> <!-- First Tier Drop Down --> <label for="drop-1" class="toggle">Phone +</label> <a href="#">Shop by Phone</a> <input type="checkbox" id="drop-1"/> <ul id="limheight"> <li><a href="#">Alcatel</a></li> <li><a href="#">Apple</a></li> <li><a href="#">Blackberry</a></li> <li><a href="#">Coolpad</a></li> <li><a href="#">HTC</a></li> <li><a href="#">Huawei</a></li> <li><a href="#">Kyocera</a></li> <li><a href="#">LG</a></li> <li><a href="#">Motorola</a></li> <li><a href="#">Nokia</a></li> <li><a href="#">Samsung</a></li> <li><a href="#">Sharp</a></li> <li><a href="#">Sony</a></li> <li><a href="#">ZTE</a></li> <li><a href="#">Various</a></li> </ul> </li> <li> <!-- First Tier Drop Down --> <label for="drop-2" class="toggle">Tempered Glass +</label> <a href="#">Tempered Glass</a> <input type="checkbox" id="drop-2"/> <ul> <li><a href="#">Portfolio 1</a></li> <li><a href="#">Portfolio 2</a></li> <li> <!-- Second Tier Drop Down --> <label for="drop-3" class="toggle">Works +</label> <a href="#">Works</a> <input type="checkbox" id="drop-3"/> <ul> <li><a href="#">HTML/CSS</a></li> <li><a href="#">jQuery</a></li> <li><a href="#">Python</a></li> </ul> </li> </ul> </li> <li><a href="#">About Us</a></li> <li><a href="#">Feedback</a></li> <li><a href="#">Contact</a></li> </ul>
</nav>
</body>
</html>

CaseXmode - Script Codes CSS Codes

@import url(https://fonts.googleapis.com/css?family=roboto);
body { background: #212121; font-size: 22px; line-height: 32px; color: #ffffff; margin: 0; padding: 0; word-wrap: break-word !important; font-family: 'roboto', sans-serif;
}
h1 { font-size: 60px; text-align: center; color: #FFF;
}
h3 { font-size: 30px; line-height: 34px; text-align: center; color: #FFF;
}
h3 a { color: #FFF; }
a { color: #FFF; }
h1 { margin-top: 100px; text-align: center; font-size: 60px; line-height: 70px; font-family: 'roboto', sans-serif;
}
#container { margin: 0 auto; max-width: 890px;
}
p { text-align: center; } .navtoggle,.toggle, [id^=drop] { display: none;
}
nav { margin: 0; padding: 0; background: url(http://ninepanda.com/xmode/images/header_navbg.gif); height: 80px; border-top:#3db9e4 solid 4px;
}
#logo { display: block; padding: 0 30px; float: left; font-size: 20px; line-height: 60px; margin-top:4px;
}
nav:after { content: ""; display: table; clear: both;
}
nav ul { float: right; padding: 0; margin: 0; list-style: none; position: relative;
}
nav ul li { margin: 0px; display: inline-block; float: left; background-color: #254441;	color: #8f8f8f;	font-family: 'Open Sans Condensed', sans-serif;	text-transform: uppercase;	font-weight: bold;	background: #e7e8e9;	border-left: 1px solid #bcbdbc;	-ms-transform: skewX(0deg); /* IE 9 */	-webkit-transform: skewX(0deg); /* Safari */	transform: skewX(0deg);
}
nav a { display: block; padding: 0 20px; color: #8F8F8F; font-size: 15px; line-height: 66px; text-decoration: none;
}
nav ul li ul li:hover { background: #000000; }
nav a:hover {	background: #3db9e4;	color: #FFF;}
nav ul ul { display: none; position: absolute; top: 66px;
}
nav ul li:hover > ul { display: inherit; }
nav ul ul li { width: 270px; float: none; display: list-item; position: relative;
}
nav ul ul ul li { position: relative; top: -66px; left: 170px;
}
li > a:after { content: ' +'; }
li > a:only-child:after { content: ''; }
#limheight { font-size: 0px; height: 500px; /*your fixed height*/ -webkit-column-count: 3; -moz-column-count: 3; column-count: 3; /*3 in those rules is just placeholder -- can be anything*/
}
#limheight li { display: inline-block; /*necessary*/ width:200px; font-size: 16px;
}
/* Media Queries
--------------------------------------------- */
@media all and (max-width : 768px) {
#logo { display: block; padding: 0; width: 100%; text-align: center; float: none;
}
nav { margin: 0; }
#limheight { height:830px; -webkit-column-count: 1; -moz-column-count: 1; column-count: 1; /*3 in those rules is just placeholder -- can be anything*/
}
#limheight li { display: inline-block; /*necessary*/ height: 20px; width:100%;
}
.toggle + a, .navtoggle + a, .menu { display: none; }
.navtoggle {margin-top:-70px; display: block; background-color: ; padding: 0 20px; color: #FFF; font-size: 20px; line-height: 60px; text-decoration: none; border: none; float:right; }
.toggle { display: block; background-color: #3db9e4; padding: 0 20px; color: #FFF; font-size: 20px; line-height: 60px; text-decoration: none; border: none;
}
.toggle:hover { background-color: #000000; }
[id^=drop]:checked + ul { display: block; }
nav ul li { display: block; width: 100%;
}
nav ul ul .toggle, nav ul ul a { padding: 0 40px; }
nav ul ul ul a { padding: 0 80px; }
nav a:hover, nav ul ul ul a { background-color: #000000; }
nav ul li ul li .toggle, nav ul ul a { background-color: #212121; }
nav ul ul { float: none; position: static; color: #ffffff;
}
nav ul ul li:hover > ul,
nav ul li:hover > ul { display: none; }
nav ul ul li { display: block; width: 100%;
}
nav ul ul ul li { position: static;
}
}
@media all and (max-width : 330px) {
nav ul li { display: block; width: 94%;
}
}
CaseXmode - Script Codes
CaseXmode - Script Codes
Home Page Home
Developer Ben Song
Username speedz55
Uploaded November 05, 2022
Rating 3
Size 3,057 Kb
Views 18,216
Do you need developer help for CaseXmode?

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!

Ben Song (speedz55) Script Codes
Name
Casexmode_nav3
Auctiva_ebay_casexmode
Ebay_nojs_picgallery
Casexmode_footer
NitroRCX-scalenav
Ebay_imageslide
Ebay_template3
Ebay_tabsample
Raidentechsite_addon_style.js
Nrcx_scale_layout
Create amazing love letters 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!