Vcard dev

Developer
Gabriel
Size
3,138 Kb
Views
42,504
  1. Vcard dev Previews
  2. Vcard dev HTML Codes
  3. Vcard dev CSS Codes
  4. Vcard dev JS Codes

How do I make an vcard dev?

What is a vcard dev? How do you make a vcard dev? This script and codes were developed by Gabriel on 18 July 2022, Monday.

Vcard dev Previews
IQ Test

Vcard dev - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>vcard dev</title> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/meyer-reset/2.0/reset.min.css"> <style> /* NOTE: The styles were added inline because Prefixfree needs access to your styles and they must be inlined if they are on local disk! */ @import url(http://fonts.googleapis.com/css?family=Raleway:100,400,700,900|Play);
body { font-family: 'Raleway', sans-serif; background: #222; user-select: none; user-drag: none;
}
.canceled { position: absolute; top: 10%; left: 10%; color: #da0000; font-size: 45px; transform: rotate(-12deg); padding: 10px 20px; text-transform: uppercase; font-weight: 800; background: #eee; border: 3px solid #da0000;
}
.dev { position: absolute; color: #d68b1a; top: 10px; right: 15px; font-family: 'Play'; font-weight: 400;
}
.main { display: block; padding: 20px 0 10px; margin: 250px auto 0; width: 250px; height: 105px; background: #1f262d; background: radial-gradient(ellipse, rgba(22,22,22,.9), rgba(22,22,22,.3)); background-size: 500px 300px; color: #fff; font-size: 45px; font-weight: 100; text-align: center; animation: blurIn 1.5s 1;
}
.main span { font-weight: 700;
}
.bx { width: 200px; height: 50px; line-height: 50px; padding: 0 0 0 20px; font-size: 18px; font-weight: 100; background: red; background: #1f262d; background: radial-gradient(ellipse, rgba(22,22,22,.9), rgba(22,22,22,.3)); background-size: 3px 100px;
}
.bx a { color: #fff; text-decoration: none;
}
.backstretch { -webkit-filter: grayscale(40%); filter: grayscale(40%);
}
@keyframes blurIn { 0% {-webkit-filter: blur(7px);} 25% {-webkit-filter: blur(5px);} 50% {-webkit-filter: blur(3px);} 75% {-webkit-filter: blur(1px);} 100% {-webkit-filter: blur(0px);}
} </style> <script src="https://cdnjs.cloudflare.com/ajax/libs/prefixfree/1.0.7/prefixfree.min.js"></script>
</head>
<body> <div class="dev">dev v0.1</div>
<div class="canceled">canceled</div>
<div class="main"> Gabriel<br><span>Wanzek</span>
</div>
<div class="bx bx1"> <a href="http://mangopix.de/ps">Photostream</a>
</div>
<div class="bx bx2"> <a href="mailto:[email protected]">Mail</a>
</div>
<div class="bx bx3"> <a href="http://github.com/GabrielWanzek">Github</a>
</div>
<div class="bx bx4"> <a href="http://codepen.io/gab">CodePen</a>
</div>
<div class="bx bx5"> <a href="http://steamcommunity.com/id/xunocore">Steam</a>
</div>
<div class="bx bx6"> <a href="skype:gabriel-x-">Skype</a>
</div> <script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/jquery-backstretch/2.0.4/jquery.backstretch.min.js'></script> <script src="js/index.js"></script>
</body>
</html>

Vcard dev - Script Codes CSS Codes

@import url(http://fonts.googleapis.com/css?family=Raleway:100,400,700,900|Play);
body { font-family: 'Raleway', sans-serif; background: #222; user-select: none; user-drag: none;
}
.canceled { position: absolute; top: 10%; left: 10%; color: #da0000; font-size: 45px; transform: rotate(-12deg); padding: 10px 20px; text-transform: uppercase; font-weight: 800; background: #eee; border: 3px solid #da0000;
}
.dev { position: absolute; color: #d68b1a; top: 10px; right: 15px; font-family: 'Play'; font-weight: 400;
}
.main { display: block; padding: 20px 0 10px; margin: 250px auto 0; width: 250px; height: 105px; background: #1f262d; background: radial-gradient(ellipse, rgba(22,22,22,.9), rgba(22,22,22,.3)); background-size: 500px 300px; color: #fff; font-size: 45px; font-weight: 100; text-align: center; animation: blurIn 1.5s 1;
}
.main span { font-weight: 700;
}
.bx { width: 200px; height: 50px; line-height: 50px; padding: 0 0 0 20px; font-size: 18px; font-weight: 100; background: red; background: #1f262d; background: radial-gradient(ellipse, rgba(22,22,22,.9), rgba(22,22,22,.3)); background-size: 3px 100px;
}
.bx a { color: #fff; text-decoration: none;
}
.backstretch { -webkit-filter: grayscale(40%); filter: grayscale(40%);
}
@keyframes blurIn { 0% {-webkit-filter: blur(7px);} 25% {-webkit-filter: blur(5px);} 50% {-webkit-filter: blur(3px);} 75% {-webkit-filter: blur(1px);} 100% {-webkit-filter: blur(0px);}
}

Vcard dev - Script Codes JS Codes

$.backstretch( [ "http://gabrielw.de/img/bg1.jpg", "http://gabrielw.de/img/bg2.jpg", "http://gabrielw.de/img/bg3.jpg" ], {duration: 5000, fade: 750}
);
Vcard dev - Script Codes
Vcard dev - Script Codes
Home Page Home
Developer Gabriel
Username gab
Uploaded July 18, 2022
Rating 3.5
Size 3,138 Kb
Views 42,504
Do you need developer help for Vcard dev?

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!

Gabriel (gab) Script Codes
Name
Css3 background-clip
Inline editing with jquery
BEST PLACEHOLDING SERVICES
A clicking cookie gaaaame...
LocalStorage Test
A Pen by Gabriel
Loggy.js - CSS formatted JS console logs
Cool toggle with filling effect
HINT.css - just a little test
Animated Trash Icon pure CSS
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!