قالب 404 -طرح فضانورد
سفارش تبليغات در انجــمن قالب گراف ورود به تاپيک اطلاعيه هاي تابستانه قالب گراف
امور گرافيکي و کدنويسي وب خود را به جي جي ميزبان بسپاريد
نام کاربري : پسورد : فراموش

قصد توهین به فضانوردان و موحوادات فضایی رو نداشتم!!!

ایده برداری شده از یک سایت خارجی

کد نویسی شده با جاوا اسکرپیت

اینم کد:

کد:
<!doctype html>

<html

lang="en-US"> <head> <meta charset="utf-8">

<title>not found!</title> <meta

name="keywords" content="" /> <meta name="description"

content=" " /> <meta name="viewport"

content="width=device-width, initial-scale=1.0" /> <meta

property="og:site_name" content="404"/> <meta

property="fb:admins" content="655647081"/> <meta

property="fb:app_id" content="319532633444"/> <meta

property="og:type" content="website" /> <meta

property="og:image"

content="http://up.ghalebgraph.ir/up/galebgraph/file/1394/08/spaceman.svg"/>

<meta property="og:description" content=""/>

<meta name="twitter:card" content="summary_large_image">

<meta name="twitter:title" content=""> <meta

name="twitter:description" content=""> <meta

name="twitter:image:src" <link rel="shortcut icon"

href="http://up.ghalebgraph.ir/up/galebgraph/file/1394/08/cancel-icon.png"

/> <link rel="stylesheet"

href="http://up.ghalebgraph.ir/up/galebgraph/file/1394/08/nfinder.css"

/> <script type="text/javascript"> var _gaq =

_gaq || []; _gaq.push(['_setAccount', 'UA-634584-2']);

_gaq.push(['_setDomainName', 'www.iconfinder.com']);

_gaq.push(['_setAllowLinker', true]);_gaq.push(['_setCustomVar',

1, 'Signed in',

'False', 2

]);_gaq.push(['_setCustomVar', 2,'Pro

subscriber','False', 2]);_gaq.push(['_trackPageview']);

(function() { var ga =

document.createElement('script'); ga.type = 'text/javascript'; ga.async =

true; ga.src = ('https:' ==

document.location.protocol ? 'https://ssl' : 'http://www') +

'.google-analytics.com/ga.js'; var s =

document.getElementsByTagName('script')[0];

s.parentNode.insertBefore(ga, s); })();

</script><script type="text/javascript"

src="http://up.ghalebgraph.ir/up/galebgraph/file/1394/08/finder2.js"></script>

<!--[if lte IE 8]> <script

src="http://up.ghalebgraph.ir/up/galebgraph/file/1394/08/html5shiv.js"></script>

<![endif]--> </head> <body

id="view-pagenotfound" data-application="system" data-view="page

notfound"> <a id="top"></a>

<style type="text/css"> html, body { overflow:

hidden; background: #000; padding: 0px; margin:

0px; width: 100%; height: 100%; } .fullScreen {

height: 100%; }

a.logo {

position: absolute; bottom: 50px; right: 50px;

width: 250px; }

img.rotating {

position: absolute; left: 50%; top: 50%;

margin-left: -256px; margin-top: -256px;

-webkit-transition: opacity 2s ease-in; -moz-transition:

opacity 2s ease-in; -o-transition: opacity 2s ease-in;

-ms-transition: opacity 2s ease-in; transition: opacity

2s ease-in; }

@-webkit-keyframes rotating {

from{ -webkit-transform: rotate(0deg); }

to{ -webkit-transform: rotate(360deg); }

}

@-moz-keyframes rotating { from{

-moz-transform: rotate(0deg); } to{

-moz-transform: rotate(360deg); } }

@-o-keyframes rotating { from{ -o-transform:

rotate(0deg); } to{ -o-transform:

rotate(360deg); } }

@-ms-keyframes rotating

{ from{ -ms-transform: rotate(0deg);

} to{ -ms-transform: rotate(360deg);

} }

.rotating { -webkit-animation:

rotating 120s linear infinite; -moz-animation: rotating 120s

linear infinite; }

div.pagenotfound-text { position: absolute; bottom: 50px; left: 50px; }

h1 { background: -webkit-linear-gradient(#5f5287,

#8b7cb9); -webkit-background-clip: text;

-webkit-text-fill-color: transparent; font-size: 34px;

font-weight: bold; letter-spacing: -2px;

line-height: 50px; }

h2 { color: white;

font-size: 24px; font-weight: normal;

.opacity(50); }

a { color: white; text-decoration: none; border-bottom: none; } a:hover { color: white; text-decoration: none; }

</style> <div class="fullScreen" id="fullScreen">

<a href="/" class="logo"><img src="" /></a>

<img class="rotating"

src="http://up.ghalebgraph.ir/up/galebgraph/file/1394/08/spaceman188235.svg"

/> <div class="pagenotfound-text">

<h1>Page lost in space</h1> <h2><a

href="/">Go back to the homepage</a></h2>

</div> <canvas id="canvas2d"></canvas>

</div> <script type="text/javascript"> /** * The

stars in our starfield! * Stars coordinate system is relative to the

CENTER of the canvas * @param {number} x * @param {number} y

*/ var Star = function(x, y, maxSpeed) { this.x = x;

this.y = y; this.slope = y / x; // This only works because our

origin is always (0,0) this.opacity = 0; this.speed =

Math.max(Math.random() * maxSpeed, 1); };

/** * Compute

the distance of this star relative to any other point in space. *

* @param {int} originX * @param {int} originY * *

@return {float} The distance of this star to the given origin */

Star.prototype.distanceTo = function(originX, originY) { return

Math.sqrt(Math.pow(originX - this.x, 2) + Math.pow(originY - this.y,

2)); };

/** * Reinitializes this star's attributes,

without re-creating it * * @param {number} x * @param

{number} y * * @return {Star} this star */

Star.prototype.resetPosition = function(x, y, maxSpeed) {

Star.apply(this, arguments); return this; };

/** *

The BigBang factory creates stars (Should be called StarFactory, but

that is * a WAY LESS COOL NAME! * @type {Object} */ var

BigBang = { /** * Returns a random star within a region

of the space. * * @param {number} minX minimum X

coordinate of the region * @param {number} minY minimum Y

coordinate of the region * @param {number} maxX maximum X

coordinate of the region * @param {number} maxY maximum Y

coordinate of the region * * @return {Star} The random

star */ getRandomStar: function(minX, minY, maxX, maxY,

maxSpeed) { var coords = BigBang.getRandomPosition(minX,

minY, maxX, maxY); return new Star(coords.x, coords.y,

maxSpeed); },

/** * Gets a random (x,y)

position within a bounding box * * * @param

{number} minX minimum X coordinate of the region * @param

{number} minY minimum Y coordinate of the region * @param

{number} maxX maximum X coordinate of the region * @param

{number} maxY maximum Y coordinate of the region * *

@return {Object} An object with random {x, y} positions */

getRandomPosition: function(minX, minY, maxX, maxY) {

return { x: Math.floor((Math.random() * maxX) + minX),

y: Math.floor((Math.random() * maxY) + minY) };

} };

/** * Constructor function of our starfield.

This just prepares the DOM nodes where * the scene will be rendered.

* * @param {string} canvasId The DOM Id of the <div>

containing a <canvas> tag */ var StarField =

function(containerId) { this.container =

document.getElementById(containerId); this.canvasElem =

this.container.getElementsByTagName('canvas')[0]; this.canvas =

this.canvasElem.getContext('2d');

this.width = this.container.offsetWidth; this.height = this.container.offsetHeight;

this.starField = []; };

/** * Updates the properties for every star for the next frame

to be rendered */ StarField.prototype._updateStarField =

function() { var i, star, randomLoc,

increment;

for (i = 0; i < this.numStars; i++) { star = this.starField;

increment = Math.min(star.speed, Math.abs(star.speed /

star.slope)); star.x += (star.x > 0) ? increment :

-increment; star.y = star.slope * star.x;

star.opacity += star.speed / 100;

// Recycle star obj if it goes out of the frame

if ((Math.abs(star.x) > this.width / 2) ||

(Math.abs(star.y) > this.height / 2)) { //randomLoc =

BigBang.getRandomPosition( // -this.width / 2,

-this.height / 2, // this.width, this.height

//); randomLoc = BigBang.getRandomPosition(

-this.width / 10, -this.height / 10,

this.width / 5, this.height / 5 );

star.resetPosition(randomLoc.x, randomLoc.y, this.maxStarSpeed);

} } };

/** * Renders the whole starfield

(background + stars) * This method could be made more efficient by

just blipping each star, * and not redrawing the whole frame */

StarField.prototype._renderStarField = function() { var i,

star; // Background this.canvas.fillStyle =

"rgba(0, 0, 0, .5)"; this.canvas.fillRect(0, 0, this.width,

this.height); // Stars for (i = 0; i < this.numStars;

i++) { star = this.starField;

this.canvas.fillStyle = "rgba(188, 213, 236, " + star.opacity + ")";

this.canvas.fillRect( star.x + this.width / 2,

star.y + this.height / 2, 2, 2); }

};

/** * Function that handles the animation of each frame.

Update the starfield * positions and re-render */

StarField.prototype._renderFrame = function(elapsedTime) { var

timeSinceLastFrame = elapsedTime - (this.prevFrameTime || 0);

window.requestAnimationFrame(this._renderFrame.bind(this));

// Skip frames unless at least 30ms have passed since the last

one // (Cap to ~30fps) if (timeSinceLastFrame >= 30 ||

!this.prevFrameTime) { this.prevFrameTime = elapsedTime;

this._updateStarField(); this._renderStarField();

} };

/** * Makes sure that the canvas size fits the

size of its container */ StarField.prototype._adjustCanvasSize =

function(width, height) { // Set the canvas size to match the

container ID (and cache values) this.width =

this.canvasElem.width = width || this.container.offsetWidth;

this.height = this.canvasElem.height = height ||

this.container.offsetHeight; };

/** * This listener

compares the old container size with the new one, and caches * the

new values. */ StarField.prototype._watchCanvasSize =

function(elapsedTime) { var timeSinceLastCheck = elapsedTime -

(this.prevCheckTime || 0), width, height;

window.requestAnimationFrame(this._watchCanvasSize.bind(this));

// Skip frames unless at least 333ms have passed since the last

check // (Cap to ~3fps) if (timeSinceLastCheck >= 333

|| !this.prevCheckTime) { this.prevCheckTime = elapsedTime;

width = this.container.offsetWidth; height =

this.container.offsetHeight; if (this.oldWidth !== width ||

this.oldHeight !== height) { this.oldWidth = width;

this.oldHeight = height;

this._adjustCanvasSize(width, height); } } };

/** * Initializes the scene by resizing the canvas to the

appropiate value, and * sets up the main loop. * @param {int}

numStars Number of stars in our starfield */

StarField.prototype._initScene = function(numStars) { var i;

for (i = 0; i < this.numStars; i++) {

this.starField.push( BigBang.getRandomStar(-this.width /

2, -this.height / 2, this.width, this.height, this.maxStarSpeed)

); }

// Intervals not stored because I don't plan

to detach them later...

window.requestAnimationFrame(this._renderFrame.bind(this));

window.requestAnimationFrame(this._watchCanvasSize.bind(this)); };

/** * Kicks off everything! * @param {int} numStars The

number of stars to render * @param {int} maxStarSpeed Maximum speed

of the stars (pixels / frame) */ StarField.prototype.render =

function(numStars, maxStarSpeed) { this.numStars = numStars ||

100; this.maxStarSpeed = maxStarSpeed || 3;

this._initScene(this.numStars); };

/** * requestAnimationFrame shim layer with setTimeout fallback

* @see

http://paulirish.com/2011/requestanimationframe-for-smart-animating

*/ (function() { var lastTime = 0; var vendors = ['ms',

'moz', 'webkit', 'o']; for(var x = 0; x < vendors.length

&& !window.requestAnimationFrame; ++x) {

window.requestAnimationFrame =

window[vendors[x]+'RequestAnimationFrame'];

window.cancelAnimationFrame =

window[vendors[x]+'CancelAnimationFrame'] ||

window[vendors[x]+'CancelRequestAnimationFrame']; }

if

(!window.requestAnimationFrame) window.requestAnimationFrame

= function(callback, element) { var currTime = new

Date().getTime(); var timeToCall = Math.max(0, 16 -

(currTime - lastTime)); var id =

window.setTimeout(function() { callback(currTime + timeToCall); },

timeToCall); lastTime = currTime +

timeToCall; return id; };

if

(!window.cancelAnimationFrame) window.cancelAnimationFrame =

function(id) { clearTimeout(id); }; }());

// Kick off! var starField = new StarField('fullScreen').render(333, 3); </script>

<script type="text/javascript">(function(w) {

w.FACEBOOK_APP_ID = '551474624906319'; w.STRIPE_PUBLISHABLE_KEY =

'pk_live_4WvRhCNvhRplOQTUvs65uw9w';

var bsa =

document.createElement('script'); bsa.type = 'text/javascript';

bsa.async = true; bsa.src = 'https://cdn.buysellads.com/ac/pro.js';

document.getElementsByTagName('head')[0].appendChild(bsa);

}(window));

</script> <script async type="text/javascript"

src="http://up.ghalebgraph.ir/up/galebgraph/file/1394/08/77775.html"></script>

<div id="fb-root"></div> <script

type="text/javascript">adroll_adv_id="WFC5ZQ7JFZHX3A2YOSX7AE",adroll_pix_id="PZHUY52KNFFF7HZ3QYANR4",function(){var

a=window.onload;window.onload=function(){__adroll_loaded=!0;var

b=document.createElement("script"),c="https:"==document.location.protocol?"https://s.adroll.com":"http://a.adroll.com";b.setAttribute("async","true"),b.type="text/javascript",b.src=c+"/j/roundtrip.js",((document.getElementsByTagName("head")||[null])[0]||document.getElementsByTagName("script")[0].parentNode).appendChild(b),a&&a()}}();</script>

</body></html>

امضاي کاربر :
https://t.me/M_o_bb_i_n

تشکر شده:

11 کاربر از whatyouknow به خاطر اين مطلب مفيد تشکر کرده اند: mahdio77 / dominar / sayedmobin / maedeh6666 / warrior / amirhasan007 / reactor / naserabdollah / anti-virus / 0606 / 24maman /

پاسخ ها

جالبه

ممنون

امضاي کاربر :

تشکر شده:

1 کاربر از mahdio77 به خاطر اين مطلب مفيد تشکر کرده اند: whatyouknow /

بسی متفاوت و زیباست

تشکور فراوان

امضاي کاربر :

تشکر شده:

1 کاربر از ahmadreza9001 به خاطر اين مطلب مفيد تشکر کرده اند: whatyouknow /

جالب و شیکه مرسی : )

امضاي کاربر :


=-=-=-=-=-=-=-=-=-=
خداروشکر...
=-=-=-=-=-=-==-=-=

تشکر شده:

2 کاربر از maedeh6666 به خاطر اين مطلب مفيد تشکر کرده اند: whatyouknow / 0606 /

قشنگه...

امضاي کاربر :


مِـــرسیـ اَز بَعضیــا...♥

بَـــد بَرایـ خِــیلیا...!

تشکر شده:

2 کاربر از amirhasan007 به خاطر اين مطلب مفيد تشکر کرده اند: whatyouknow / 0606 /

ممنون

امضاي کاربر :
نسخه گرافیک آپدیت شد

تشکر شده:

1 کاربر از manotoweb به خاطر اين مطلب مفيد تشکر کرده اند: whatyouknow /

ایده برداری شده از یک سایت خارجی

ایده برداری نه کپی برداری

امضاي کاربر :
...

براي نمايش پاسخ جديد نيازي به رفرش صفحه نيست روي تازه سازي پاسخ ها کليک کنيد !
اين قالب رو با آخرين متد هاي کدنويسي سعي کردم کدنويسي کنم که واقعا خوب شد.تشکر از کساني که کمکون کردند.
قالب جديد انجمن حرف نداره و به نظرم خيلي قالب خوبيه و انگار مخصوص قالب گرافيا طراحي شده.چون واقعا حرفه اي است.