MULTISHIPPER 01

Developer
Doe
Size
4,202 Kb
Views
16,192
  1. MULTISHIPPER 01 Previews
  2. MULTISHIPPER 01 HTML Codes
  3. MULTISHIPPER 01 CSS Codes
  4. MULTISHIPPER 01 JS Codes

How do I make an multishipper 01?

What is a multishipper 01? How do you make a multishipper 01? This script and codes were developed by Doe on 20 December 2022, Tuesday.

MULTISHIPPER 01 Previews
IQ Test

MULTISHIPPER 01 - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>MULTISHIPPER 01</title> <link rel="stylesheet" href="css/style.css">
</head>
<body> <div class='colors'> <div class='test' style='background: #be4b4b;'></div> <div class='test' style='background: #9e2d2d;'></div> <div class='test' style='background: #912525;'></div> <div class='test' style='background: #2b2b2b;'></div> <div class='test' style='background: #3d3d3d;'></div> <div class='test' style='background: #5e5e5e;'></div>
</div>
<div class='getbetter'> <div class='inner'> <div class='in'> <ul class='tabs'> <li class='active' rel='tab1'>TH</li> <li rel='tab2'>AE</li> <li rel='tab3'>AV</li> <li rel='tab4'>MF</li> </ul> <div id='tab1' class='content'> <img src='https://68.media.tumblr.com/b7858a86e9767d38d0bebc7517077fe0/tumblr_o6kianoQEs1vnjeaoo1_400.gif' /> <div class='header'> <h1> tom hardy </h1> <h2>39. charming. husband.</h2> </div> <div class='scroll'>	Lorem ipsum dolor sit amet, consectetur adipisici elit, sed eiusmod tempor incidunt ut labore et dolore magna aliqua. Inmensae subtilitatis, obscuris et malesuada fames. Cum sociis natoque penatibus et magnis dis parturient.	<p>Cum ceteris in veneratione tui montes, nascetur mus. Morbi fringilla convallis sapien, id pulvinar odio volutpat. Qui ipsorum lingua Celtae, nostra Galli appellantur. Sed haec quis possit intrepidus aestimare tellus. Excepteur sint obcaecat cupiditat non proident culpa. Me non paenitet nullum festiviorem excogitasse ad hoc.	<p>Magna pars studiorum, prodita quaerimus. Ab illo tempore, ab est sed immemorabili. Mercedem aut nummos unde unde extricat, amaras. Cras mattis iudicium purus sit amet fermentum. Gallia est omnis divisa in partes tres, quarum. Contra legem facit qui id facit quod lex prohibet.	<p>Ullamco laboris nisi ut aliquid ex ea commodi consequat. Praeterea iter est quasdam res quas ex communi. Plura mihi bona sunt, inclinet, amari petere vellent. Pellentesque habitant morbi tristique senectus et netus.	<p>Quis aute iure reprehenderit in voluptate velit esse. Morbi odio eros, volutpat ut pharetra vitae, lobortis sed nibh. Quisque placerat facilisis egestas cillum dolore. </div> </div> <!-- #tab1 --> <div id='tab2' class='content'> <img src='http://68.media.tumblr.com/b7d758fa675a6c4d57393d854fcf8c1d/tumblr_n3vmkvMoJn1rco4h9o4_r1_250.gif' /> <div class='header'> <h1> adèle exarchopoulos </h1> <h2>23. stunning. wife.</h2> </div> <div class='scroll'>	<ul>	<li><a>link name</a> description.</li>	<li><a>link name</a> kind of a longer description can go as well if you want.</li>	</ul> </div> </div> <!-- #tab1 --> <div id='tab3' class='content'> <img src='http://68.media.tumblr.com/8482d9994331a6d9dd6f8b0ac72c855c/tumblr_mpqt2ytYzO1s5i7l4o1_250.gif' /> <div class='header'> <h1> alicia vikander </h1> <h2>28. flawless. queen.</h2> </div> <div class='scroll'>	<ul>	<li><a>link name</a> description.</li>	<li><a>link name</a> kind of a longer description can go as well if you want.</li>	</ul> </div> </div> <!-- #tab2 --> <div id='tab4' class='content'> <img src='http://68.media.tumblr.com/2e0ef363cab0cec2c6cbe9a115dec9ff/tumblr_inline_oc95lbaAnR1rifr4k_500.gif' /> <div class='header'> <h1> michael fassbender </h1> <h2>40. roguish. king.</h2> </div> <div class='scroll'>	<ul>	<li><a>link name</a> description.</li>	<li><a>link name</a> kind of a longer description can go as well if you want.</li>	</ul> </div> </div> <!-- #tab3 --> </div> </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>

MULTISHIPPER 01 - Script Codes CSS Codes

@import url('https://fonts.googleapis.com/css?family=Righteous|Satisfy|Source+Sans+Pro:400,900');
body { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -ms-flex-line-pack: center; align-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; background: #f6f6f6;
}
.colors { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -ms-flex-line-pack: start; align-content: flex-start; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start;
}
.test { width: 100px; height: 100px; margin: 0 0 50px; }
.getbetter {	width: 450px;	height: 450px;	padding: 15px;	background: url(https://cdn.nickpic.host/images/IyDNDQ.png);	background-attachment: fixed;
}
.getbetter .inner {	outline: 3px double #3d3d3d;	height: 430px;	padding: 10px;
}
.getbetter .inner .in {	background: rgba(255,255,255,0.8);	height: 400px;	padding: 15px;
}
.getbetter .tabs {	list-style: none;	margin: 0;	padding: 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -ms-flex-line-pack: center; align-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center;	background: rgba(43,43,43,0.3);	border: 3px solid rgba(43,43,43,0.5);	background-clip: padding-box;
}
.getbetter .tabs li {	-webkit-box-flex: 1; -ms-flex: 1; flex: 1; text-align: center; text-transform: uppercase;	font: 8px/8px righteous;	color: #ffffff;	padding: 10px 7px 10px 10px;	cursor: crosshair;	letter-spacing: 3px;
}
.getbetter .tabs li:hover {	background: rgba(43,43,43,0.8);
}
.getbetter .tabs li.active { background: rgba(145,37,37,0.75);
}
.getbetter .content { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -ms-flex-line-pack: center; align-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center;
}
.getbetter .content img {	width: 216px;	height: 150px;	-o-object-fit: cover; object-fit: cover;	border: 3px solid rgba(43,43,43,0.5);	border-top: none;	margin: 0 0 5px;
}
.getbetter .content .header {	border: 3px solid rgba(43,43,43,0.5);	border-top: none;	border-left: none;	width: 175px;	height: 150px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: stretch; -ms-flex-pack: stretch; justify-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch; -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch;	margin: 0 0 5px;
}
.getbetter .content h1 {	-webkit-box-flex: 1; -ms-flex: 1 auto; flex: 1 auto;	font: normal 22px/22px satisfy;	text-transform: lowercase;	background: #9e2d2d;	color: #ffffff;	margin: 0;	padding: 15px;	display: inline-block;	word-spacing: 100px;	text-align: center; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -ms-flex-line-pack: center; align-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center;	background-clip: padding-box;	border-bottom: 3px solid rgba(43,43,43,0.5);
}
.getbetter .content h2 {	font: normal 7px/7px righteous;	background: rgba(43,43,43,0.3);	text-transform: uppercase;	color: #ffffff;	letter-spacing: 1px;	padding: 15px;	margin: 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -ms-flex-line-pack: center; align-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center;
}
.getbetter .content .scroll {	height: 208px;	width: 400px;	overflow: auto;
}
.getbetter .content .scroll::-webkit-scrollbar {	width: 5px;	background: transparent;
}
.getbetter .content .scroll::-webkit-scrollbar-thumb {	background: rgba(0,0,0,0.75);
}

MULTISHIPPER 01 - Script Codes JS Codes

 // tabbed content // http://www.entheosweb.com/tutorials/css/tabs.asp $(".content").hide(); $(".content:first").show(); /* if in tab mode */ $("ul.tabs li").click(function() { $(".content").hide(); var activeTab = $(this).attr("rel"); $("#"+activeTab).fadeIn(); $("ul.tabs li").removeClass("active"); $(this).addClass("active"); $(".tab_drawer_heading").removeClass("d_active"); $(".tab_drawer_heading[rel^='"+activeTab+"']").addClass("d_active"); });	/* if in drawer mode */	$(".tab_drawer_heading").click(function() { $(".content").hide(); var d_activeTab = $(this).attr("rel"); $("#"+d_activeTab).fadeIn(); $(".tab_drawer_heading").removeClass("d_active"); $(this).addClass("d_active"); $("ul.tabs li").removeClass("active"); $("ul.tabs li[rel^='"+d_activeTab+"']").addClass("active"); });	/* Extra class "tab_last" to add border to right side of last tab */	$('ul.tabs li').last().addClass("tab_last");
MULTISHIPPER 01 - Script Codes
MULTISHIPPER 01 - Script Codes
Home Page Home
Developer Doe
Username tomhvrdyy
Uploaded December 20, 2022
Rating 3
Size 4,202 Kb
Views 16,192
Do you need developer help for MULTISHIPPER 01?

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!

Doe (tomhvrdyy) Script Codes
Name
BI SPECIES RATIO
LEGACY TRACKER
CURSE CELL TEMPLATE
CRSL THREAD TEMPLATE
HEROIC APP
A Pen by Doe
NOA MINI FORK
Create amazing sales emails 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!