Blogger Spoiler Kodları

   Sitenizde çok amaçlı olarakta kullanabileceğiniz bu kodlar işinizi olduğundan daha fazla kolaylaştıracaktır.Blog makalelerinde bazen konumuza göre yazımız uzun veya kısa olabiliyor,veya konu içerinde önemli yerleri vurgulamak gibi,veya konu ile alakalı başka bir bilgi göstermek için ve yazının uzun olmaması için kullanılan bu spoiler kodları sayesinde yazılarınızda fark yaratabilirsiniz.Bu kodlar ile ister resim ister video veya yazı fark etmez içerik olarak her şey eklenebilir.

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script><br /> <style> /* ---------------- CSS SPOILER BASIC ------------------ */ .buka-tutup { text-align:center; cursor:pointer; } #tkp { margin-top:15px; padding:5px; } </style><br /> <button class="buka-tutup">Tikla ve gor!</button><br /> <div id="tkp" style="display:none;"> Göründüğü üzere butona tıklandığında bu şekilde sade ve güzel bir alan açılacaktır, içerisine video, kod kutusu veya herhangi bir yazı ekliyebilirsiniz.</br><center> <iframe width="100%" height="400" src="//www.youtube.com/embed/9lXnPec-kDQ" frameborder="0" allowfullscreen></iframe></center> </div> <script> //<![CDATA[ $('.buka-tutup').toggle(function() { $(this).text('Tikla ve gizle!'); $('#tkp').slideDown(800); }, function() { $(this).text('Tikla ve gor!'); $('#tkp').slideUp(100); }); //]]> </script><br />

<div dir="ltr" style="text-align: left;" trbidi="on"> <div> <input onclick="if(this.parentNode.getElementsByTagName('div')[0].style.display != ''){this.parentNode.getElementsByTagName('div')[0].style.display = '';this.value = 'Bilgisayarınızda ki Tüm Dosyaları Silmek İçin -Gizle';}else{this.parentNode.getElementsByTagName('div')[0].style.display = 'none'; this.value = 'Bilgisayarınızda ki Tüm Dosyaları Silmek İçin -Göster';}" type="button" value="Yazıyı Aç" /><br /> <div style="display: none;"> Gördüğünüz üzere bu şekilde çalışan bir kod.</div> </div> </div>

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min .js"></script><br /> <script type="text/javascript"> function toggleDiv(divId) { $("#"+divId).toggle(); } </script><br /> <br /> <br /> <br /> <a href="javascript:toggleDiv('myContent');" style="background- color: #ccc; padding: 5px 10px;">Toggle Button</a><br /> <div id="myContent" style="background-color: #aaa; padding: 5px 10px;"> The content in this div will hide and show (toggle) when the <br /> <br /> toggle is pressed. <br /> </div>

<input type="button" onclick="if(document.getElementById('spoiler1') .style.display=='none') {document.getElementById('spoiler1') .style.display=''; this.value = 'İçeriği Gizle'; }else{document.getElementById('spoiler1') .style.display='none';this.value = 'İçeriği Göster'; }" value="İçeriği Göster"/><div id="spoiler1" style="display:none"> <br /> eklemek istediginiz icerigi buraya yazicaksiniz.. yazi, resim ya da video<br /> <br /> </div>

Bizi Takip Edin...
Pinterest>>Facebook>>Twitter
 © by bilgicafem61
Aşağıda Yorum ve Sorularınızı Bırakın...