Koddostu tarafından sizlere özel kodlanmış, çekmeceli ve pencere efektli retro giriş ekranı koduna bayılacaksınız.
Bu hazır kod,sitenizdeki sayfaları 8 ayrı çekmece ile 8 ayrı link halinde sunabileceğiniz çok şık bir intro ekranı sunuyor.
<!--Author: koddostu.com-->
<!--Licence: GNU GPL V2.0-->
<!--Name: Retro İntro Kodu - Hazır Kod-->
<!--Kod Dostu Retro İntro Kodu START-->
<!--Telif Sahibi: www.koddostu.com-->
<!--Bu çalışma Creative Commons Attribution 3.0 Unported Lisansı ile lisanslanmıştır.-->
<script src="http://code.jquery.com/jquery-latest.js"></script><koddostu></koddostu>
<style type="text/css">div.koddostu-tisikirlir{position:fixed;z-index:9900;}div.sipirmin-koddostu{top:0px;left:0px;width:100%;height:100%;background:#290700 url(http://4.bp.blogspot.com/-1Fn_lRVkAA8/US8z9bu70OI/AAAAAAAASrk/aAgziOKvWrg/s1600/kdostu.jpg) repeat top left;}</style><style type="text/css">div.koddostu-tisikirlir{_position:absolute;}div.sipirmin-koddostu{_bottom:auto;_top:expression(ie6=(document.documentElement.scrollTop+document.documentElement.clientHeight - 52+"px") );}
.sipaydirmen{display:inline-block;margin:20px 10px;background-color:#290700;position:relative;width:112px;height:53px;overflow:hidden;vertical-align:top;border-top:1px solid #290700;-webkit-border-top-left-radius: 2px;-webkit-border-top-right-radius: 2px;border-top-left-radius: 2px;border-top-right-radius: 2px;}
.tisikirlir{position:absolute;top:-10px;border-left:1px solid #390700;border-right:1px solid #390700;
left:0px;display:block;width:230px;height:67px;background:transparent url(http://3.bp.blogspot.com/-CmSyvS7VWGA/US8k28WhKdI/AAAAAAAASm0/asiBY2lhPpA/s1600/drawer_small_wlabel.png) no-repeat -59px 0px;text-align:left !important;padding-left:28px;padding-top:31px;font-family:Helvetica, Arial, sans-serif;font-size:12px;font-weight:normal;color:#da2;text-decoration:none !important;}
.tisikirlir span{text-align:center;display:block;background-color:transprent;width:57px;text-decoration:none !important;font-family:Helvetica, Arial, sans-serif;font-size:12px;font-weight:normal;color:#da2;}
#text-shadow-box {position: fixed;left: 0;right: 0;top: 0;bottom: 0;width: 100%;height: 100%;overflow: hidden;background: transparent;font-family: Rockwell, Arial, sans-serif;-webkit-tap-highlight-color: rgba(0,0,0,0);-webkit-user-select: none;}#text-shadow-box #tsb-text,#text-shadow-box #tsb-link {position: absolute;top: 40%;left: 0;width: 100%;height: 1em;margin: -0.77em 0 0 0;font-size: 70px;line-height: 1em;font-weight: bold;text-align: center;}#text-shadow-box #tsb-text {font-size: 100px;color: transparent;text-shadow: black 0px -45.2px 19px;}#text-shadow-box #tsb-link a {color: #FFFFFF;text-decoration: none;}#text-shadow-box #tsb-box,#text-shadow-box #tsb-wall {position: absolute;top: 41%;left: 0;width: 100%;height: 60%;}#text-shadow-box #tsb-box {}#text-shadow-box #tsb-wall {background: #999;}#text-shadow-box #tsb-wall p {position: relative;font-size: 15px;line-height: 1.5em;text-align: justify;color: #222;width: 550px;margin: 1.5em auto;cursor: default;}#text-shadow-box #tsb-wall p a {color: #fff;}#text-shadow-box #tsb-wall p a:hover {text-decoration: none;color: #000;background: #fff;}#tsb-spot {position: absolute;top: -50%;left: -50%;width: 200%;height: 200%;pointer-events: none;background: -webkit-gradient(radial, center center, 0, center center, 450, from(rgba(0,0,0,0)), to(rgba(0,0,0,1)));background: -moz-radial-gradient(center 45deg, circle closest-side, transparent 0, black 450px);}
</style>
<div class="koddostu-tisikirlir sipirmin-koddostu">
<center>
<div class="benoylemidedim" style="position:relative;margin-top:10%;width:326px;height:190px;margin-bottom:25px;">
<div style="width:162px;height:156px;border-top:2px solid #521300;border-bottom:2px solid #521300;background:#f2f2f2 url(http://3.bp.blogspot.com/-kvM9K1V7YQg/UQPk0RMwr6I/AAAAAAAARyM/R2izk9QUdcI/s1600/koddostusaydam.png) repeat top left;position:absolute;z-index:9910;top:12px;left:82px;-moz-box-shadow: inset 0 0 6px 3px #000;-webkit-box-shadow: inset 0 0 6px 3px #000;box-shadow: inset 0 0 6px 3px #000;">
<a style="display:block;margin-top:15px;font-family:Helvetica, Arial, sans-serif;color:#c60;font-weight:bold;font-size:16px; text-shadow: 0px 0px 4px #888;">Hoşgeldiniz!<br/><br/><br/><span style="font-size:14px;">Haydi bir çekmece seçin!</span></a>
</div>
<div class="rightpenn" style="position:relative;z-index:9940;display:inline-block;width:162px;height:184px;background:transparent url(http://3.bp.blogspot.com/-WLuHPEGgfeY/US8k3FJhl6I/AAAAAAAASm4/6HJpmxHUgjw/s1600/windowLeftOpenSequence.png) no-repeat -1px 0px"></div><div class="leftpenn" style="position:relative;z-index:9940;display:inline-block;width:162px;height:184px;background:transparent url(http://1.bp.blogspot.com/-oZipEY67MWs/US8k3uUaldI/AAAAAAAASm8/Rsrks-7tH2c/s1600/windowRightOpenSequence.png) no-repeat -964px 0px"></div>
</div>
<!--[if IE]>
<style type="text/css">
#tsb-spot {display: none;}#tsb-ie {position: absolute;top: -90%;left: -50%;width: 200%;height: 334%;background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPHJhZGlhbEdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgY3g9IjUwJSIgY3k9IjUwJSIgcj0iNzUlIj4KICAgIDxzdG9wIG9mZnNldD0iMCUiIHN0b3AtY29sb3I9IiMwMDAwMDAiIHN0b3Atb3BhY2l0eT0iMCIvPgogICAgPHN0b3Agb2Zmc2V0PSI3NCUiIHN0b3AtY29sb3I9IiMwMDAwMDAiIHN0b3Atb3BhY2l0eT0iMSIvPgogICAgPHN0b3Agb2Zmc2V0PSIxMDAlIiBzdG9wLWNvbG9yPSIjMDAwMDAwIiBzdG9wLW9wYWNpdHk9IjEiLz4KICA8L3JhZGlhbEdyYWRpZW50PgogIDxyZWN0IHg9Ii01MCIgeT0iLTUwIiB3aWR0aD0iMTAxIiBoZWlnaHQ9IjEwMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);}
</style>
<![endif]-->
<div id="text-shadow-box"><div id="tsb-box"></div><p id="tsb-text"></p><div id="tsb-ie"></div> <div id="tsb-spot"></div></div>
<script type="text/javascript" language="javascript" charset="utf-8">
var text = null;var spot = null;var box = null;var boxProperty = '';init();function init() {
text = document.getElementById('tsb-text');
spot = document.getElementById('tsb-spot');
if (text && spot) {
document.getElementById('text-shadow-box').onmousemove = onMouseMove;
document.getElementById('text-shadow-box').ontouchmove = function (e) {e.preventDefault(); e.stopPropagation(); onMouseMove({clientX: e.touches[0].clientX, clientY: e.touches[0].clientY});};
}
}
function onMouseMove(e) {
if (typeof e === 'undefined' || typeof e.clientX === 'undefined') {
return;}
var xm = (e.clientX - Math.floor(window.innerWidth / 2)) * 0.4;
var ym = (e.clientY - Math.floor(window.innerHeight / 3)) * 0.4;
var d = Math.round(Math.sqrt(xm*xm + ym*ym) / 5);
xm = e.clientX - Math.floor(window.innerWidth / 2);
ym = e.clientY - Math.floor(window.innerHeight / 2);
spot.style.backgroundPosition = xm + 'px ' + ym + 'px';
}
</script>
<div class="sipaydirmen">
<a href="http://www.koddostu.com/genel.html" target="_blank" class="tisikirlir"><span>Genel</span></a>
</div>
<div class="sipaydirmen">
<a href="http://www.koddostu.com/forum.html" target="_blank" class="tisikirlir"><span>Forum</span></a>
</div>
<div class="sipaydirmen">
<a href="http://www.koddostu.com/blog.html" target="_blank" class="tisikirlir"><span>Blog</span></a>
</div>
<div class="sipaydirmen">
<a href="http://www.koddostu.com/ekstra.html" target="_blank" class="tisikirlir"><span>Ekstra</span></a>
</div><br/>
<div class="sipaydirmen">
<a href="http://www.koddostu.com/link5.html" target="_blank" class="tisikirlir"><span>Link5</span></a>
</div>
<div class="sipaydirmen">
<a href="http://www.koddostu.com/link6.html" target="_blank" class="tisikirlir"><span>Link6</span></a>
</div>
<div class="sipaydirmen">
<a href="http://www.koddostu.com/link7.html" target="_blank" class="tisikirlir"><span>Link7</span></a>
</div>
<div class="sipaydirmen">
<a href="http://www.koddostu.com/link8.html" target="_blank" class="tisikirlir"><span>Link8</span></a>
</div>
<a href="javascript:void(0)" onclick="window.open('h'+'t'+'tp'+':'+'//'+'w'+'ww.'+'k'+'oddo'+'stu.'+'c'+'om/2013/02/r'+'etro-i'+'ntro-k'+'odu-h'+'azr-k'+'od.'+'h'+'tml','')" style="position:absolute;bottom:5px;right:15px;color:#440;text-decoration:none;">© Koddostu </a>
</center>
<script>
$(".sipaydirmen").mouseenter(function(){
$(this).animate({
height: "63px",
marginBottom: "10px",
}, 200 );
$(this).children('a').eq(0).css({ backgroundColor: "0d0300" });
$(this).children('a').eq(0).animate({
top: "0px"
}, 200 );
$(".sipaydirmen").not(this).children('a').css({ backgroundColor: "290700" });
$(".sipaydirmen").not(this).children('a').animate({
top: "-10px"
}, 200 );
$(".sipaydirmen").not(this).animate({
marginBottom: "20px",
height: "53px"
}, 200 );
});
$(document).ready(function(){
evetac();
});
$(".benoylemidedim").mouseenter(function(){
evetkapa();
setTimeout(function(){evetac();},500);
});
function acbiraz(){
$(".leftpenn").css({ backgroundPosition: "+=160px 0px" });
$(".rightpenn").css({ backgroundPosition: "-=160px 0px" });
}
function kapabiraz(){
$(".leftpenn").css({ backgroundPosition: "-=160px 0px" });
$(".rightpenn").css({ backgroundPosition: "+=160px 0px" });
}
function evetac(){
setTimeout(function(){acbiraz();},100);
setTimeout(function(){acbiraz();},200);
setTimeout(function(){acbiraz();},300);
setTimeout(function(){acbiraz();},400);
setTimeout(function(){acbiraz();},500);
setTimeout(function(){acbiraz();},600);
}
function evetkapa(){
setTimeout(function(){kapabiraz();},10);
setTimeout(function(){kapabiraz();},100);
setTimeout(function(){kapabiraz();},200);
setTimeout(function(){kapabiraz();},300);
setTimeout(function(){kapabiraz();},400);
setTimeout(function(){kapabiraz();},500);
}
</script>
</div>
<!--Telif Sahibi: www.koddostu.com-->
<!--Bu çalışma Creative Commons Attribution 3.0 Unported Lisansı ile lisanslanmıştır.-->
<!--Kod Dostu Retro İntro Kodu STOP-->
<script src="https://www.koddostu.com/duzelt.js?no=169"></script>