How to add photos!!

Hi every1  im getting alot of Questions how to add Pictures here's one way 

  go to www.Imgur.com

Make an account.
Click on your username in the top right corner.
Click on images.
Click add images. {Just 4 images}
After you add them click on the first picture you want to add.
Copy the "DIRECT LINK".
Now go to your Spacehey page to edit you About Me box.


This is the code you paste.
You will now copy and paste whatever your "DIRECT LINK" is in between the parentheses that is beside --image1: url.  


let me know if it works 

<style>
:root{
--image1: url(https://i.imgur.com/T1dbzep.jpg);
--image2: url(https://i.imgur.com/O8yQN2g.jpg);
--image3: url(https://i.imgur.com/hwaw5Z8.jpg);
--image4: url(https://i.imgur.com/oNpY32t.jpg);
--time: 30s;
}
.pdg_slideshow{ width:100%; height:500px; position:relative; }
@media only screen and (max-width: 768px) { .pdg_slideshow{ height:300px; } }
.pdg_slideshow_image { background-size:contain;background-repeat:no-repeat;background-position:center; width:100%; height:100%; position:absolute;}
.pdg_slideshow_image#image1 {background-image:var(--image1); animation: slide1 var(--time) ease 0s infinite normal none; }
.pdg_slideshow_image#image2 {background-image:var(--image2); animation: slide2 var(--time) ease 0s infinite normal none; }
.pdg_slideshow_image#image3 {background-image:var(--image3); animation: slide3 var(--time) ease 0s infinite normal none; }
.pdg_slideshow_image#image4 {background-image:var(--image4); animation: slide4 var(--time) ease 0s infinite normal none; }

@keyframes slide1 { 0%, 25%, 100% { opacity: 0; } 1%, 24% { opacity: 1; } } 
@keyframes slide2 { 0%, 25%, 50%, 100% { opacity: 0; } 26%, 49% { opacity: 1; } } 
@keyframes slide3 { 0%, 50%, 75%, 100% { opacity: 0; } 51%, 74% { opacity: 1; } } 
@keyframes slide4 { 0%, 75%, 100% { opacity: 0; } 76%, 99% { opacity: 1; } } 
</style>
<div class="pdg_slideshow">
<div class="pdg_slideshow_image" id="image1"></div>
<div class="pdg_slideshow_image" id="image2"></div>
<div class="pdg_slideshow_image" id="image3"></div>
<div class="pdg_slideshow_image" id="image4"></div>
</div>


2 Kudos

Comments

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