ash lynx's profile picture

Published by

published
updated

Category: Web, HTML, Tech

Akatsuki video profile

any akatsuki fans out there? i made a video profile using codes cory posted here! be sure to check him out and add him if you haven't already! i have it set as the profile background on my throw away account. (be advised that the mobile and desktop version of this are different. the video doesnt work on mobile.)


________________________________________________________

<div class="video-background">
<div class="video-foreground">
<iframe allowfullscreen="" class="bg_video_maybe" frameborder="0" src="https://www.youtube-nocookie.com/embed/6wmRQUc96yM?controls=0&autoplay=1&mute=1&showinfo=0&rel=0"></iframe>
</div>
</div>
<style>
@media screen and (max-width: 600px) {
.video-foreground {
visibility: hidden;
}
}
.video-background {
background: #000 url('https://i.pinimg.com/564x/b4/41/f1/b441f127776562ffcf5bdc3f6f0d207b.jpg') no-repeat center;
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
z-index: -99;
}
.video-foreground, .video-background iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
pointer-events: none;
}
main {
/* This changes your profile background in order to have the video visable, change the 0.6 to any number between 0 and 1 to change the visibility */
background-color: rgba(0, 0, 0, 0.2);
}
@media (min-aspect-ratio: 16/9) {
.video-foreground {
height: 300%;
top: -100%;
}
}
@media (max-aspect-ratio: 16/9) {
.video-foreground {
width: 300%;
left: -100%;
}
}

</style>

<style>
main:before {
 width: 100%;
 height: 300px;
 display: block;
 content: "";
 background-image: url('https://i.pinimg.com/originals/a6/61/93/a661935c4126d02290d5be9dfbd61e59.gif');
 background-position: center center;
 background-size: cover;
}
</style>

<style>
footer {
        border-radius: 15px;
background-image: url(https://i.pinimg.com/564x/19/83/3a/19833a9a3c8fcf7585ac710b11700606.jpg); 
</style>

<style>
@import 
url('https://fonts.googleapis.com/css2?family=Amatic+SC&display=swap');
:root {
  --font-family: monospace;
  --mynamesize: 25px
;}
  h1, h2, h3, h4, h5, a, p, nav label, .section{ 
font-family: var(--font-family) !important; 
 text-shadow: !important;
 text-transform:!important;
}
h1, h2, h3, h4,h5,a, p, nav label, .section {color: black;}
h1 {
  color: white ;
}
table, th, td {
  border: none ;
}
:root {
        --logo-blue: ;
        --darker-blue: ;
        --lighter-blue: ;
        --even-lighter-blue: ;
        --lightest-blue:  ;
        --dark-orange: #000000 ;
        --light-orange: ;
        --even-lighter-orange: ;
        --green: red;
    }
.profile .contact,
    .profile .url-info,
    .profile .table-section,
    .home-actions {
        border: none ;
    }
   a.ditto-link {
        display: block;
        margin: 10px 0;
        color: #cc3e3e;
        font-size: 1.4rem;
        font-weight: bold;
        animation: blinker 1s linear infinite;
    }
    .profile-pic {
        border-radius: 500px;
        overflow: hidden;
    }
    .heading {
        padding: 5px 0 !important;
        margin-top: 15px;
        margin-bottom: 10px;
        background-color: transparent !important;
        color: white !important;
        border-bottom: 2px solid;
    }
    .container {
        border-radius: 15px 15px 0 0;
        overflow: hidden;
        margin-top: 30px;
        padding: 10px;
    }
    table.comments-table td {
        background-color: !important;
    }
    .comments-table td:first-child img {
        width: 80px;
        border-radius: 500px;
    }
    .profile .friends .person img {
        border-radius: 500px;
    }
    .blog-preview p {
        font-size: 1.4rem;
    }
    .contact {
  border-radius: 25px;
  background: url(https://i.pinimg.com/564x/4c/4f/4c/4c4f4cf0c3d59fe7e8469c2197c4950b.jpg);
  background-position: center center;
   background-size: cover;
  padding: 20px;
  width: 200px;
  height: 150px;
}


</style>

<style>* {cursor: url(https://cur.cursors-4u.net/anime/ani-10/ani981.cur), auto !important;}</style>

<style>

body:before {
content: " ";
height: 100vh;
width: 100vw;
display: block;
position: fixed; 
top: 0; 
left: 0; 
z-index: 100;
background-image: url('https://66.media.tumblr.com/d7289ef6a712a77d52393ae871eee7b9/tumblr_p1lja2ZCAa1r2hy3ro1_500.gifv');
background-size: cover;
background-repeat: no-repeat;
animation: yourAnimation 3s ease 0s 1 normal forwards;
pointer-events: none;
}
@keyframes yourAnimation { 0.0%{ opacity: 1;} 75%{ opacity: 1; } 100%{ opacity: 0;} } 
</style>


6 Kudos

Comments

Displaying 2 of 2 comments ( View all | Add Comment )

Kogi Hime

Kogi Hime's profile picture

it looks rad! you do so terrific on these


Report Comment



thank you so much!! its my favorite one ive made so far!

by ash lynx; ; Report

✧ 𝒟𝓎𝓁𝒶𝓃 ✧

✧ 𝒟𝓎𝓁𝒶𝓃 ✧'s profile picture

This is dope 👌


Report Comment



thank you so much! its my favorite one ive made so far!

by ash lynx; ; Report