文章/答案/技术大牛

发布

社区首页 >问答首页 >让jquery.texteffects.js使用dream函数

问让jquery.texteffects.js使用dream函数
EN

Stack Overflow用户

提问于 2012-11-08 05:54:03

回答 1查看 246关注 0票数 0

我已经尝试了几个小时来让texteffects.js与下面的Dream函数一起工作。我已经尝试过用document.ready将文本包围起来，我还创建了一个函数并从Dream div事件中调用它，而不是使用div。

 <!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>

我做错了什么？

有什么想法吗？

谢谢

javascript

jquery

html

回答 1

Stack Overflow用户

回答已采纳

发布于 2012-11-08 09:18:10

虽然jQuery.texteffects.js在我的项目中，但它不是一个include。一旦我把它包含进去，它就起作用了。

谢谢

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/13278930

复制

相似问题

问让jquery.texteffects.js使用dream函数
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问让jquery.texteffects.js使用dream函数EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问让jquery.texteffects.js使用dream函数
EN