Ralph Lauren Mimic

Developer
Saysora
Size
3,067 Kb
Views
28,322

How do I make an ralph lauren mimic?

Saw Ralph Lauren's little tab. And I thought... Why not give it a shot?. What is a ralph lauren mimic? How do you make a ralph lauren mimic? This script and codes were developed by Saysora on 26 August 2022, Friday.

Ralph Lauren Mimic Previews
IQ Test

Ralph Lauren Mimic - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>Ralph Lauren Mimic</title> <meta http-equiv="X-UA-Compatible" content="IE=Edge">
<meta name="viewport" content="width=device-width"> <link rel="stylesheet" href="css/style.css">
</head>
<body> <div id ="wrap"> <div id="ribbon" class="red small-height"> <div class="innertext"> <p>Modern Explorer</p> <div class="moreinfo"> <h6 class="red">Share</h6> <hr/> <p><img src="http://s.cdpn.io/26158/fb.png"> <img src="http://s.cdpn.io/26158/twitter.png"> <img src="http://s.cdpn.io/26158/pin.png"> </p> <h6 class="red">&nbsp;Shop</h6> <hr/> <p><a href="http://ralphlauren.com">Ralphlauren.com</a> </p> </div> </div> </div> <div class="bottomtri"></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>

Ralph Lauren Mimic - Script Codes CSS Codes

* { margin: 0; padding: 0;
}
#wrap { width: 960px; max-width: 100%; min-height: 800px; margin: auto 25px;
}
#ribbon { width: 150px; cursor: pointer; overflow: hidden; -webkit-transition: 0.1s height;
}
#ribbon .innertext { color: #fff; text-transform: uppercase; font-family: "Helvetica"; display: block; padding: 15px 10px; text-align: center; font-size: 12px;
}
#ribbon .innertext img { opacity: 0.8; margin-left: 13px;
}
#ribbon .innertext img:hover { opacity: 1;
}
#ribbon .moreinfo { margin-top: 25px;
}
#ribbon .moreinfo h6 { position: relative; z-index: 15; width: 20px; margin: 0 auto; display: block; padding: 2px 24px 2px 14px; font-size: 9px;
}
#ribbon .moreinfo hr { margin-top: -9px; background: #fff; height: 0.5px; border: none; z-index: 14;
}
#ribbon .moreinfo p { display: block; width: 100%; margin: 15px 0; text-align: justify;
}
.red { background: #cd4a20;
}
.bottomtri { padding-bottom: 15px; width: 0; height: 0; border-left: 75px solid transparent; border-right: 75px solid transparent; border-top: 25px solid #cd4a20; cursor: pointer;
}
.small-height { height: 45px;
}
.extend { height: 160px;
}
a { padding-left: 5px; color: #fff; text-decoration: none;
}

Ralph Lauren Mimic - Script Codes JS Codes

$(document).ready(function(){ $('#ribbon').click(function(){ $(this).toggleClass('extend'); });
});
Ralph Lauren Mimic - Script Codes
Ralph Lauren Mimic - Script Codes
Home Page Home
Developer Saysora
Username azureknight
Uploaded August 26, 2022
Rating 3
Size 3,067 Kb
Views 28,322
Do you need developer help for Ralph Lauren Mimic?

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!

Saysora (azureknight) Script Codes
Name
Flat UI Login
First Loading Animation
Grow Circle Animation
Service Card Animation
CSS Browser
Responsive Background
CSS Tab Holder
Life Mottos
Value vs Placeholder
Beautiful Ribbon
Create amazing art & images 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!