728x90 AdSpace

Breaking

[recent][ticker2]
26 April 2012

Membuat Tampilan Typewriter pada Postingan

Membuat Tampilan Typewriter pada Postingan




Ini dia nih skrip yang bisa bikin postingan kayak lagi ngetik di mesin ketik.

<br />
<style type="text/css">
 body{
  font-family: Trebuchet MS, Lucida Sans Unicode, Arial, sans-serif;
  margin-top:0px;
   background-repeat:no-repeat;
  padding-top:1px;
 }
    #myContent, #myContent blink{
        width:100%px;
        height:100%px;
        background:black;
        color: #00FF00;
        font-family:courier;
    }  
    blink{
        display:inline;
    }
    </style><br />
    <script type="text/javascript">
  var charIndex = -1;
    var stringLength = 0;
    var inputText;
    function writeContent(init){
     if(init){
      inputText = document.getElementById('contentToWrite').innerHTML;
     }
        if(charIndex==-1){
            charIndex = 0;
            stringLength = inputText.length;
        }
        var initString = document.getElementById('myContent').innerHTML;
  initString = initString.replace(/<SPAN.*$/gi,"");
     
        var theChar = inputText.charAt(charIndex);
        var nextFourChars = inputText.substr(charIndex,4);
        if(nextFourChars=='<BR>' || nextFourChars=='<br>'){
         theChar  = '<BR>';
         charIndex+=3;
        }
        initString = initString + theChar + "<SPAN id='blink'>_</SPAN>";
        document.getElementById('myContent').innerHTML = initString;

        charIndex = charIndex/1 +1;
  if(charIndex%2==1){
             document.getElementById('blink').style.display='none';
        }else{
             document.getElementById('blink').style.display='inline';
        }
             
        if(charIndex<=stringLength){
            setTimeout('writeContent(false)',10);
        }else{
         blinkSpan();
        }
    }
        var currentStyle = 'inline';
    function blinkSpan(){
     if(currentStyle=='inline'){
      currentStyle='none';
     }else{
      currentStyle='inline';
     }
     document.getElementById('blink').style.display = currentStyle;
     setTimeout('blinkSpan()',500);
   
    }
    </script>
 
<div id="myContent">
</div><div id="contentToWrite" style="display:none">
TULISAN ANDA <br />
1. No Smoking, No Die <br />
2. No Women, No Cry <br />
3. No Watch, No Brook<br />
4. No Money, No Dong<br />
</div><script type="text/javascript">
writeContent(true);
</script><br />
<br />
Membuat Tampilan Typewriter pada Postingan Reviewed by Munadi di Sini on Thursday, April 26, 2012 Rating: 5 Kalau pada beberapa waktu yang lalu blog ini pernah mengulas mengenai cara menampilkan huruf seperti huruf mesin ketik pada p...

Reaksi:

[Posting][carousel1]

12 comments:

  1. komen back ya gan dan thanks infonya....
    http://khairulabdal.blogspot.com/2012/04/final-liga-champion-eropa-2012.html

    ReplyDelete
  2. disini selalu ada yang mantabss, trimakasih gan tutorialnya:}

    ReplyDelete
  3. wah mantap ini yang saya cari2 thanks sob...

    ReplyDelete
  4. AnonymousMay 01, 2012

    tidak percuma saya datanga kesini, makasih sudah share

    ReplyDelete
  5. beuuuuh mantap gan exis trus,sukses slalu gan,numpan nimrung

    ReplyDelete
  6. wah mantap neh.. ane coba dulu y sob.. mg bisa... makasih infonya...

    ReplyDelete
  7. @donimasrul Silakan dicoba Sob n terima kasih udah mampir di sini

    ReplyDelete