jquery.texteffects.js가 dream 함수로 작동하도록 만들기

저는 몇 시간 동안 texteffects.js가 아래의 Dream 함수로 작동하도록 노력했습니다. div로 텍스트를 둘러 봤습니다. document.ready를 수행하는 대신 함수를 작성하고 Dream Document.Ready 이벤트에서 호출했습니다.jquery.texteffects.js가 dream 함수로 작동하도록 만들기

<!DOCTYPE html> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"  type="text/javascript"></script> 
<title></title> 
<style> 
body{ 
    background:black; 
    overflow:hidden; 
    color:white; 
    font-size:2em; 
} 
.drawingpix { 
position:absolute; 
top:-50px; 
left:-50px; 
} 

</style> 

</head> 

<body> 
<p id="typetext"> 
    The text to display 
</p> 
<script src="Scripts/jquery.texteffects.js"></script> 
<script type="text/javascript"> 
    //the function that creates dream 
    function dream() { 
     //calculating random color of dream 
     var color = 'rgb(' + Math.floor(Math.random() * 255) + ',' + Math.floor(Math.random() * 255) + ',' + Math.floor(Math.random() * 255) + ')'; 

     //calculating random X position 
     var x = Math.floor(Math.random() * $(window).width()); 

     //calculating random Y position 
     var y = Math.floor(Math.random() * $(window).height()); 

     //creating the dream and hide 
     drawingpix = $('<span>').attr({ class: 'drawingpix' }).hide(); 

     //appending it to body 
     $(document.body).append(drawingpix); 

     //styling dream.. filling colors.. positioning.. showing.. growing..fading 
     drawingpix.css({ 
      'background-color': color, 
      'border-radius': '100px', 
      '-moz-border-radius': '100px', 
      '-webkit-border-radius': '100px', 
      top: y - 14, //offsets 
      left: x - 14 //offsets 
     }).show().animate({ 
      height: '500px', 
      width: '500px', 
      'border-radius': '500px', 
      '-moz-border-radius': '500px', 
      '-webkit-border-radius': '500px', 
      opacity: 0.1, 
      top: y - 250, //offsets 
      left: x - 250 
     }, 3000).fadeOut(2000); 

     //Every dream's end starts a new dream 
     window.setTimeout('dream()', 200); 
    } 

    $(document).ready(function() { 

     //calling the first dream 
     dream(); 

    }); 
    $(document).ready(function() { 
     $("#typetext p").texteffects({ "texteffect": "unexplode", "speed": "slow", "delay": "1000" }); 
    }); 
</script> 
</body> 

</html>

내가 뭘 잘못하고 있니?

아이디어가 있으십니까? jQuery.texteffects.js 내 프로젝트에 있었지만

는이 포함되지 않은, 당신

출처

2012-11-07 Sheri Trager