Adobe Shockwave Layout

Tags: 90s, 2000s, internet, autoplay

Description:

I made this layout based on the discontinued web browser plugin, Adobe Shockwave (formerly known as Macromedia Shockwave and Shockwave Director), and used it in my latest blog post here (background song is 7 Days - Bullet For My Valentine): https://blog.spacehey.com/entry?id=1158168

Preview:

click on the image for a larger preview

Code:

<!-- (c) Layout created by xxRebellious_Emmaxx (https://layouts.spacehey.com/layout?id=104188) -->

<iframe src="https://www.youtube.com/embed/IgLMEMlsA-Q//?&;amp;;autoplay=1&;loop=1&;controls=1" title="YouTube video player" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen="" loading="lazy" data-ruffle-polyfilled="" width="0" height="0" frameborder="0">
</iframe>


<style>:root{
    --logo-blue: #993300;
    --darker-blue: #ff704d;
    --lighter-blue: #662200;
    --even-lighter-blue: #CC0000;
    --lightest-blue: #ff3300;
    --light-orange: #993300
}

/* width */
    ::-webkit-scrollbar {
        width: 20px;
    }

    /* Track */
    ::-webkit-scrollbar-track {
          background-image: url(img src="https://i.ibb.co/4JPm1NR/th-304190098-removebg-preview.png);
    }

    /* Handle */
    ::-webkit-scrollbar-thumb {
        background: #e3e7e8;
        border: 2px outset;
    }

    /* Handle on hover */
    ::-webkit-scrollbar-thumb:hover {
        background: #bbc2c4;
    }

.contact .inner a img:before {
    font-size: 1em;
    display: block
}

.contact .inner .f-row:nth-child(1) .f-col:nth-child(1) a:before {
/* add to friends */
content: url("https://i.ibb.co/0Mr3qTR/th-3432825120-removebg-preview.png");
}
.contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a:before {
/* add to favorite */
content: url("https://i.ibb.co/b3qLHhD/th-618032028-removebg-preview.png");
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:before {
/* send a message */
content: url("https://dl.glitter-graphics.com/pub/2055/2055419hv9ocd1tbg.gif");
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:before {
/* foward to friend*/
content: url("https://dl.glitter-graphics.com/pub/713/713325hau79cy6il.gif");
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a:before {
/* instant message */
content: url("https://i.ibb.co/0Mr3qTR/th-3432825120-removebg-preview.png");
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a:before {
/* block user */
content: url("https://i.ibb.co/b3qLHhD/th-618032028-removebg-preview.png");
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a:before {
/* add 2 group  */
content: url("https://dl.glitter-graphics.com/pub/2055/2055419hv9ocd1tbg.gif");
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:before {
/* report */
content: url("https://dl.glitter-graphics.com/pub/713/713325hau79cy6il.gif");
}

.icon {
content: url(https://dl.glitter-graphics.com/pub/3571/3571233kbve2b19nn.gif);
display: inline-block;
height: 1.1em;
width: 1.5em;
margin: 0 .05em 0 .1em;
vertical-align: -0.3em;
color: rgba(0,0,0,0);

}

.main{
background-image: url('https://dl.glitter-graphics.com/pub/2446/2446710p8z0sqtopb.gif');
            background-repeat: repeat;
            background-attachment: fixed;
            background-size: auto;
}

nav .top {
 background: linear-gradient(#e8bdbd , #970f0f 40%, red); 
 box-shadow: #fff6 0px 0px 2px 3px inset;
}



nav .links a {
  color: #ff471a;
  text-shadow: red 0px 4px 4px;
  padding: 1px
}

nav .links a:hover {
  color: #ffe680;

  text-decoration: none;
  padding-top: 0;
}

nav .links li.active a {
  color: #ff8c1a; 
  font-weight: normal;
}

nav .links li:not(:last-child)::after, footer .links li:not(:last-child)::after {
  color: white;
  text-shadow: tomato 1px 0px 1px;
}


.table-section-contacts{
background: linear-gradient(#e8bdbd , #970f0f 40%, red); 
 box-shadow: #fff6 0px 0px 2px 3px inset; !important;
}

.table-section heading, contact{
bbackground: linear-gradient(#e8bdbd , #970f0f 40%, red); 
 box-shadow: #fff6 0px 0px 2px 3px inset; !important;}
.table-section heading, .blurbs .heading{
background: linear-gradient(#e8bdbd , #970f0f 40%, red); 
 box-shadow: #fff6 0px 0px 2px 3px inset; !important;
}

footer{
background: linear-gradient(#e8bdbd , #970f0f 40%, red); 
 box-shadow: #fff6 0px 0px 2px 3px inset;
}

.friends{
background: linear-gradient(#e8bdbd , #970f0f 40%, red); 
 box-shadow: #fff6 0px 0px 2px 3px inset; !important;
}

.contacting{
background: linear-gradient(#e8bdbd , #970f0f 40%, red); 
 box-shadow: #fff6 0px 0px 2px 3px inset; !important;
}

.heading .comments, Heading{
background-color: rgba(102, 0, 0, 0.7); color: black; text-shadow: 2px 2px 2px #CC0000; padding: 5px; box-shadow: 0 0 10px black; border-radius: 2px;) !important;
}

input {
   background: linear-gradient(0deg, rgba(255,255,255,1) 31%, rgba(198,198,198,1) 100%);
   border: 2px solid #fff;
}

.online {
   content: url(https://dl.glitter-graphics.com/pub/1896/1896388vha8hkl1un.gif);
}



         body {
            background-image: url('https://dl.glitter-graphics.com/pub/2985/2985210exbgpfiqmr.gif');
            background-repeat: repeat;
            background-attachment: fixed;
            background-size: auto;
         }
      </style>

<style>
.logo {

content:url("https://i.ibb.co/xfb4yQP/8233-clip-5-F00-image002-5-F00-17-A13-F5-E-jpg-JPEG-Image-554-289-pixels-removebg-preview.png");
}

</style>

<style>
main{ background-color: rgba(174, 46, 0, 0.7); color: white; text-shadow: 2px 2px 2px #CC0000; padding: 5px; box-shadow: 0 0 10px black; border-radius: 2px;)  !important;}
body{ background-color: rgba(255, 69, 0, 0.4( !important;}
</style>

<style>
<iframe width="0" height="0" src="https://www.youtube.com/embed/Yr9mYxubxVg//?&;amp;;autoplay=1&;loop=1&;controls=1" title="the wiggles" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen="" loading="lazy">

</style>



            <style>
body:before {
content: " ";
height: 100vh;
width: 100vw;
display: block;
position: fixed; 
top: 0; 
left: 0; 
z-index: 100;
background-image: url('https://lh3.googleusercontent.com/proxy/PougWl0A4QJzG65ih9H9VEuYF8NrmdSfxtNKnJmDmeMsJLixHg7mwu1zLSZJ1w9sfaSehbyV_5OPEe1YTMExAkrVcn-23ZX5MygdNgrQB79Vwz2jF0Vmh8mVxpyY_P_acLRfynxOVPRWjAjTHg');
background-size: auto;
background-repeat: repeat;
background-position:center;
animation: yourAnimation 3.2s ease 0s 1 normal forwards;
pointer-events: none;}
@keyframes yourAnimation { 0.0%{ opacity: 1;} 75%{ opacity: 1; } 100%{ opacity: 0;} } 
            </style>

<style>* {cursor: url(http://www.rw-designer.com/cursor-download.php?id=12038), auto;}</style>
<style>A:hover{cursor: url("http://www.rw-designer.com/cursor-download.php?id=12047"), auto;}
</style>
<div style="float:  ; max-width: 100%; height: auto; position: fixed; right: 1px; bottom: 9px; z-index: 200;"><img src="https://i.ibb.co/NsZLzgL/th-3579271830-removebg-preview.png" alt="Shockwave 4 Ever"/></div>

Copy and paste this code into the "About me" section of your Profile to use it.

Caution: This Layout was not inspected by SpaceHey — use it at your own risk.

Comments

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

@🍀ZombieBug🍔🐞

1715420067

BRO THIS ONE IT'S SO COOL!! (The website is super fun fr :b)

Report Comment

XxLie_AbilityxX

1714271557

YOOO THIS LAYOUT IS COOL ASF !!! :00

Report Comment