كود Error 404 - خدمات ويب و Blogger

البحث بالمدونه

الأربعاء

كود Error 404

صوره



الكود


<!DOCTYPE html>

<html>

    <head>

        <meta charset="utf-8" />

        <link href="images/404.ico" rel="icon">

        <title>Error 404 HaCkEr 101 HkRkoz al KuwaiT</title>

        <style type="text/css">

            * {

                margin: 0;

                padding: 0;

            }

            

            html {

                height: 100%;

                overflow: hidden;

            }

            

            canvas {

                z-index: 1;

                position: absolute;

                left: 0;

                top: 0;

                width: 100%;

                height: 100%;

            }

            

            .caps {

                z-index: 2;

                position: absolute;

                left: 0;

                top: 0;

                width: 100%;

                height: 100%;

                opacity: 0;

                -webkit-animation: as 3s linear infinite;

                -moz-animation: asd 12s linear infinite;

                -o-animation: asd 12s linear infinite;

                animation: asd 12s linear infinite;

            }

            

            .caps img {

                display: block;

                width: 100%;

                height: 100%;

            }

            

            @-webkit-keyframes as {

                0% {

                    opacity: 0;

                }

                10% {

                    opacity: .3;

                }

                20% {

                    opacity: .1;

                }

                30% {

                    opacity: .5;

                }

                40% {

                    opacity: 0;

                }

                50% {

                    opacity: .8;

                }

                55% {

                    opacity: 0;

                }

                55% {

                    opacity: 0;

                }

            }

            

            @-moz-keyframes as {

                0% {

                    opacity: 0;

                }

                10% {

                    opacity: .3;

                }

                20% {

                    opacity: .1;

                }

                30% {

                    opacity: .5;

                }

                40% {

                    opacity: 0;

                }

                50% {

                    opacity: .8;

                }

                55% {

                    opacity: 0;

                }

                55% {

                    opacity: 0;

                }

            }

            

            @-o-keyframes as {

                0% {

                    opacity: 0;

                }

                10% {

                    opacity: .3;

                }

                20% {

                    opacity: .1;

                }

                30% {

                    opacity: .5;

                }

                40% {

                    opacity: 0;

                }

                50% {

                    opacity: .8;

                }

                55% {

                    opacity: 0;

                }

                55% {

                    opacity: 0;

                }

            }

            

            @keyframes as {

                0% {

                    opacity: 0;

                }

                10% {

                    opacity: .3;

                }

                20% {

                    opacity: .1;

                }

                30% {

                    opacity: .5;

                }

                40% {

                    opacity: 0;

                }

                50% {

                    opacity: .8;

                }

                55% {

                    opacity: 0;

                }

                55% {

                    opacity: 0;

                }

            }

            

            .frame {

                z-index: 3;

                position: absolute;

                left: 0;

                top: 0;

                width: 100%;

                height: 100%;

                background: -moz-radial-gradient(center, ellipse cover, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 19%, rgba(0, 0, 0, 0.9) 100%); /* FF3.6+ */

                background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%, rgba(0, 0, 0, 0)), color-stop(19%, rgba(0, 0, 0, 0)), color-stop(100%, rgba(0, 0, 0, 0.9))); /* Chrome,Safari4+ */

                background: -webkit-radial-gradient(center, ellipse cover, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 19%, rgba(0, 0, 0, 0.9) 100%); /* Chrome10+,Safari5.1+ */

                background: -o-radial-gradient(center, ellipse cover, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 19%, rgba(0, 0, 0, 0.9) 100%); /* Opera 12+ */

                background: -ms-radial-gradient(center, ellipse cover, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 19%, rgba(0, 0, 0, 0.9) 100%); /* IE10+ */

                background: radial-gradient(ellipse at center, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 19%, rgba(0, 0, 0, 0.9) 100%); /* W3C */

                filter: progid:DXImageTransform.Microsoft.gradient(startColorstr = '#00000000', endColorstr = '#e6000000', GradientType = 1); /* IE6-9 fallback on horizontal gradient */

            

            }

            

            .frame div {

                position: absolute;

                left: 0;

                top: -20%;

                width: 100%;

                height: 20%;

                background-color: rgba(0, 0, 0, .12);

                box-shadow: 0 0 10px rgba(0, 0, 0, .3);

                -webkit-animation: asd 12s linear infinite;

                -moz-animation: asd 12s linear infinite;

                -o-animation: asd 12s linear infinite;

                animation: asd 12s linear infinite;

            }

            

            .frame div:nth-child(1) {

                -webkit-animation-delay: 0;

                -moz-animation-delay: 0;

                -o-animation-delay: 0;

                animation-delay: 0;

            }

            

            .frame div:nth-child(2) {

                -webkit-animation-delay: 4s;

                -moz-animation-delay: 4s;

                -o-animation-delay: 4s;

                animation-delay: 4s;

            }

            

            .frame div:nth-child(3) {

                -webkit-animation-delay: 8s;

                -moz-animation-delay: 8s;

                -o-animation-delay: 8s;

                animation-delay: 8s;

            }

            

            @-webkit-keyframes asd {

                0% {

                    top: -20%;

                }

                100% {

                    top: 100%;

                }

            }

            

            @-moz-keyframes asd {

                0% {

                    top: -20%;

                }

                100% {

                    top: 100%;

                }

            }

            

            @-o-keyframes asd {

                0% {

                    top: -20%;

                }

                100% {

                    top: 100%;

                }

            }

            

            @keyframes asd {

                0% {

                    top: -20%;

                }

                100% {

                    top: 100%;

                }

            }

            

            h1 {

                z-index: 3;

                position: absolute;

                font: bold 200px/200px Arial, sans-serif;

                left: 50%;

                top: 50%;

                margin-top: -100px;

                width: 100%;

                margin-left: -50%;

                height: 200px;

                text-align: center;

                color: transparent;

                text-shadow: 0 0 30px rgba(0, 0, 0, .5);

                -webkit-animation: asdd 2s linear infinite;

                -moz-animation: asdd 2s linear infinite;

                -o-animation: asdd 2s linear infinite;

                animation: asdd 2s linear infinite;

            }

            

            @-webkit-keyframes asdd {

                0% {

                    text-shadow: 0 0 30px rgba(0, 0, 0, .5);

                }

                33% {

                    text-shadow: 0 0 10px rgba(0, 0, 0, .4);

                }

                66% {

                    text-shadow: 0 0 20px rgba(0, 0, 0, .2);

                }

                100% {

                    text-shadow: 0 0 40px rgba(0, 0, 0, .8);

                }

            }

            

            @-moz-keyframes asdd {

                0% {

                    text-shadow: 0 0 30px rgba(0, 0, 0, .5);

                }

                33% {

                    text-shadow: 0 0 10px rgba(0, 0, 0, .4);

                }

                66% {

                    text-shadow: 0 0 20px rgba(0, 0, 0, .2);

                }

                100% {

                    text-shadow: 0 0 40px rgba(0, 0, 0, .8);

                }

            }

            

            @-o-keyframes asdd {

                0% {

                    text-shadow: 0 0 30px rgba(0, 0, 0, .5);

                }

                33% {

                    text-shadow: 0 0 10px rgba(0, 0, 0, .4);

                }

                66% {

                    text-shadow: 0 0 20px rgba(0, 0, 0, .2);

                }

                100% {

                    text-shadow: 0 0 40px rgba(0, 0, 0, .8);

                }

            }

            

            @keyframes asdd {

                0% {

                    text-shadow: 0 0 30px rgba(0, 0, 0, .5);

                }

                33% {

                    text-shadow: 0 0 10px rgba(0, 0, 0, .4);

                }

                66% {

                    text-shadow: 0 0 20px rgba(0, 0, 0, .2);

                }

                100% {

                    text-shadow: 0 0 40px rgba(0, 0, 0, .8);

                }

            }

        </style>

    </head>

    <body style="text-align: center">

        <!-- page inspired http://ademilter.com/asdfghjkl -->

    

        <h1>404</h1>

        <div class="frame">

            <div></div>

            <div></div>

            <div></div>

<p align="center"><b><font color="#999966" face="MV Boli">H</font><font face="MV Boli" color="#FFA500">aCkE</font><font color="#999966" face="MV Boli">r

</font><font face="MV Boli" color="#FFFF00">1</font><font face="MV Boli" color="#FF0000">0</font><font face="MV Boli" color="#00FF00">1</font><font color="#999966" face="MV Boli">

H</font><font face="MV Boli" color="#00FF00">kRko</font><font color="#999966" face="MV Boli">z

</font><font face="MV Boli" color="#FFFFFF">al</font><font color="#999966" face="MV Boli"> 

K</font><font face="MV Boli" color="#FF0000">uwai</font><font color="#999966" face="MV Boli">T</font></b></p>

<p align="center">

&nbsp;</p>

<p align="center">

&nbsp;</p>

<p align="center">

&nbsp;</p>

        </div>

        <canvas id="canvas"></canvas>


        <script type="text/javascript">

            var Application = ( function () {

                var canvas;

                var ctx;

                var imgData;

                var pix;

                var WIDTH;

                var HEIGHT;

                var flickerInterval;

        

                var init = function () {

                    canvas = document.getElementById('canvas');

                    ctx = canvas.getContext('2d');

                    canvas.width = WIDTH = 700;

                    canvas.height = HEIGHT = 500;

                    ctx.fillStyle = 'white';

                    ctx.fillRect(0, 0, WIDTH, HEIGHT);

                    ctx.fill();

                    imgData = ctx.getImageData(0, 0, WIDTH, HEIGHT);

                    pix = imgData.data;

                    flickerInterval = setInterval(flickering, 30);

                };

        

                var flickering = function () {

                    for (var i = 0; i < pix.length; i += 4) {

                        var color = (Math.random() * 255) + 50;

                        pix[i] = color;

                        pix[i + 1] = color;

                        pix[i + 2] = color;

                    }

                    ctx.putImageData(imgData, 0, 0);

                };

        

                return {

                    init: init

                };

            }());

        

            Application.init();

            

        </script>

    </body>

</html>


سلامتكم

ليست هناك تعليقات:

إرسال تعليق

تعريب وتطوير هايف السـ العجمي ـفراني