htmlkodlari69
html kodlari
kendi html kodunu paylas
Ana Sayfa
preview
Retro İntro Kodu - Hazır Kod
Perdeli Açılış Efekti İntro Kodu
Kaydırılabilir Şematik İntro Kodu
3lü Sosyal İntro Kodu - Hazır Kod
Sitene Ekip Üyeleri Kısmı! MUHTEŞEM KOD!
Forum
moderatör alımları
Yeni sayfanın başlığı
üye ol
üye girişi
html dersleri
htmlfacebook
..
Sitene Ekip Üyeleri Kısmı! MUHTEŞEM KOD!
<script src="http://code.jquery.com/jquery-latest.js"></script><script src="http://gsgd.co.uk/sandbox/jquery/easing/jquery.easing.1.3.js"></script><div id="koddostupanel" style="text-align:left !important;position:relative;width:420px;height:100px;background-color:#444;-webkit-border-radius: 12px;border-radius: 12px;overflow:hidden;"><div style="display:none;position:absolute;top:16px;left:16px;background-color:transparent;width:329px;height:144px;font-family:Verdana, sans-serif !important;font-weight:bold;text-decoration:none !important;font-size:12px !important;color:#fff;" id="koddostudetay"></div><a class="koddostu-uye ekip1uyesi"></a><a class="koddostu-uye ekip2uyesi"></a><a class="koddostu-uye ekip3uyesi"></a><a class="koddostu-uye ekip4uyesi"></a><a class="koddostu-uye ekip5uyesi"></a><a class="koddostu-uye ekip6uyesi"></a><a class="uye3no" style="display:none; width: 92px; height: 18px; background: url(http://4.bp.blogspot.com/-jXlziTHBcAY/UB-64fgX_kI/AAAAAAAAMfk/tZeFE3oQ0kA/s1600/kd35.png) no-repeat scroll left top transparent; position: absolute; bottom: 0px; right: -64px;z-index:600" href="http://www.koddostu.com/2013/02/sitene-ekip-uyeleri-ksm-muhtesem-kod.html" onmouseout="this.style.right='-64px'" onmouseover="this.style.right='0px'" target="_blank"></a><a class="koddostu-tiklayin" style="position:absolute;bottom:0px;left:0px;width:100%;height:30px;font-size:14px;font-weight:bold;color:#fff;font-family:Verdana, sans-serif;text-align:center;">Bir ekip üyesinin resmine tıklayın.</a><button id="tacmibeybe" style="cursor:pointer;display:none;position:absolute;top:70px;right:12px;border:1px solid #777;background:#222;width:57px;-webkit-border-radius: 5px;border-radius: 5px;color:#fff;font-family:Helvetica, Arial, sans-serif;font-weight:bold;font-size:12px;">Geri</button><div style="display:none;position:absolute;bottom:0px;left:0px;width:100%;height:65px;z-index:500" id="teyntidlav"></div></div><style>.koddostu-uye{background-size:55px 55px !important;cursor:pointer;display:inline-block;width:55px;height:55px;background:#222 url(http://icons.iconarchive.com/icons/double-j-design/origami-colored-pencil/48/red-cross-icon.png) no-repeat center center;border:2px solid #222;-webkit-border-radius: 10px;border-radius: 10px;}.ekip1uyesi{position:absolute;top:8px;left:5px;z-index:100;background:#222 url(http://icons.iconarchive.com/icons/double-j-design/origami-colored-pencil/48/red-cross-icon.png) no-repeat center center !important;background-size:55px 55px !important;}.ekip2uyesi{position:absolute;top:8px;left:75px;z-index:100;background:#222 url(http://icons.iconarchive.com/icons/double-j-design/origami-colored-pencil/48/red-cross-icon.png) no-repeat center center !important;background-size:55px 55px !important;}.ekip3uyesi{position:absolute;top:8px;left:145px;z-index:100;background:#222 url(http://icons.iconarchive.com/icons/double-j-design/origami-colored-pencil/48/red-cross-icon.png) no-repeat center center !important;background-size:55px 55px !important;background-size:55px 55px !important;}.ekip4uyesi{position:absolute;top:8px;left:215px;z-index:100;background:#222 url(http://icons.iconarchive.com/icons/double-j-design/origami-colored-pencil/48/red-cross-icon.png) no-repeat center center !important;background-size:55px 55px !important;}.ekip5uyesi{position:absolute;top:8px;left:285px;z-index:100;background:#222 url(http://icons.iconarchive.com/icons/double-j-design/origami-colored-pencil/48/red-cross-icon.png) no-repeat center center !important;background-size:55px 55px !important;}.ekip6uyesi{position:absolute;top:8px;left:355px;z-index:100;background:#222 url(http://icons.iconarchive.com/icons/double-j-design/origami-colored-pencil/48/red-cross-icon.png) no-repeat center center !important;}</style><script>$(".koddostu-uye").click(function(){ document.getElementById('teyntidlav').style.display='block'; var $koddostu4 = $(this); if($(this).position().left=='5'){document.getElementById('koddostudetay').innerHTML='<span style="font-size:14px;">Ekip Üyesi: Ahmet Bilmemkim</span><br/><br/><span style="font-size:14px;">Hakkında: </span> Bu üyemiz çok şöyledir,çok böyledir. Şundan şundan sorumludur ve sitemizin şusudur. Falan filan<br/><br/>İletişim adresi:bilmemne@gmail.com'}; if($(this).position().left=='75'){document.getElementById('koddostudetay').innerHTML='<span style="font-size:14px;">Ekip Üyesi: 2. Ekip Üyesi</span><br/><br/><span style="font-size:14px;">Hakkında: </span> Bu üyemiz çok şöyledir,çok böyledir. Şundan şundan sorumludur ve sitemizin şusudur. Falan filan<br/><br/>İletişim adresi:bilmemne@gmail.com'}; if($(this).position().left=='145'){document.getElementById('koddostudetay').innerHTML='<span style="font-size:14px;">Ekip Üyesi: 3. Ekip Üyesi</span><br/><br/><span style="font-size:14px;">Hakkında: </span> Bu üyemiz çok şöyledir,çok böyledir. Şundan şundan sorumludur ve sitemizin şusudur. Falan filan<br/><br/>İletişim adresi:bilmemne@gmail.com'}; if($(this).position().left=='215'){document.getElementById('koddostudetay').innerHTML='<span style="font-size:14px;">Ekip Üyesi: 4. Ekip Üyesi</span><br/><br/><span style="font-size:14px;">Hakkında: </span> Bu üyemiz çok şöyledir,çok böyledir. Şundan şundan sorumludur ve sitemizin şusudur. Falan filan<br/><br/>İletişim adresi:bilmemne@gmail.com'}; if($(this).position().left=='285'){document.getElementById('koddostudetay').innerHTML='<span style="font-size:14px;">Ekip Üyesi: 5. Ekip Üyesi</span><br/><br/><span style="font-size:14px;">Hakkında: </span> Bu üyemiz çok şöyledir,çok böyledir. Şundan şundan sorumludur ve sitemizin şusudur. Falan filan<br/><br/>İletişim adresi:bilmemne@gmail.com'}; if($(this).position().left=='355'){document.getElementById('koddostudetay').innerHTML='<span style="font-size:14px;">Ekip Üyesi: Örnek Üye6</span><br/><br/><span style="font-size:14px;">Hakkında: </span> Bu üyemiz çok şöyledir,çok böyledir. Şundan şundan sorumludur ve sitemizin şusudur. Falan filan<br/><br/>İletişim adresi:bilmemne@gmail.com'}; $(".koddostu-tiklayin").fadeOut(300, function() { $(".uye3no").fadeIn('300'); var koddostu5 = $koddostu4.position().left; $(".koddostu-uye").not($koddostu4).animate({ top: "135px", opacity: "0.1" }, 1000 ); $("#tacmibeybe").fadeIn('100'); $koddostu4.animate({left: "350px" }, 1000, 'easeOutBounce'); $("#koddostudetay").fadeIn(1500); $("#koddostupanel").animate({ height: "200px" }, 1000, 'easeOutBounce' ); }); }); $("#tacmibeybe").click(function(){ $("#koddostudetay").fadeOut(500, function(){document.getElementById('koddostudetay').innerHTML='';}); document.getElementById('teyntidlav').style.display='none'; document.getElementById('tacmibeybe').style.display='none'; $(".ekip1uyesi").animate({top: "8px", left: "5px", opacity: "1" }, 1200, 'easeOutBounce'); $(".ekip2uyesi").animate({top: "8px", left: "75px", opacity: "1" }, 1200, 'easeOutBounce'); $(".ekip3uyesi").animate({top: "8px", left: "145px", opacity: "1" }, 1200, 'easeOutBounce'); $(".ekip4uyesi").animate({top: "8px", left: "215px", opacity: "1" }, 1200, 'easeOutBounce'); $(".ekip5uyesi").animate({top: "8px", left: "285px", opacity: "1" }, 1200, 'easeOutBounce'); $(".ekip6uyesi").animate({top: "8px", left: "355px", opacity: "1" }, 1200, 'easeOutBounce'); $("#koddostupanel").animate({ height: "100px" }, 1200, 'easeOutBounce', function(){$(".koddostu-tiklayin").fadeIn(300);} ); }); $("#teyntidlav").click(function(){ $("#koddostudetay").fadeOut(500, function(){document.getElementById('koddostudetay').innerHTML='';}); document.getElementById('teyntidlav').style.display='none'; document.getElementById('tacmibeybe').style.display='none'; $(".ekip1uyesi").animate({top: "8px", left: "5px", opacity: "1" }, 1200, 'easeOutBounce'); $(".ekip2uyesi").animate({top: "8px", left: "75px", opacity: "1" }, 1200, 'easeOutBounce'); $(".ekip3uyesi").animate({top: "8px", left: "145px", opacity: "1" }, 1200, 'easeOutBounce'); $(".ekip4uyesi").animate({top: "8px", left: "215px", opacity: "1" }, 1200, 'easeOutBounce'); $(".ekip5uyesi").animate({top: "8px", left: "285px", opacity: "1" }, 1200, 'easeOutBounce'); $(".ekip6uyesi").animate({top: "8px", left: "355px", opacity: "1" }, 1200, 'easeOutBounce'); $("#koddostupanel").animate({ height: "100px" }, 1200, 'easeOutBounce', function(){$(".koddostu-tiklayin").fadeIn(300);} ); }); </script>
kod önizlemek için tıkla
moderatör ol
Sayfa hakkında
Burda sayfan hakkındaki bilgileri yazabilirsin, başka sayfalarını yazabilirsin ya da benzeri işler ;-)
Bu web sitesi ücretsiz olarak
Bedava-Sitem.com
ile oluşturulmuştur. Siz de kendi web sitenizi kurmak ister misiniz?
Ücretsiz kaydol