美文网首页
鼠标点击 实现 浮动文字 效果

鼠标点击 实现 浮动文字 效果

作者: Nazarite_0141 | 来源:发表于2019-10-19 20:35 被阅读0次

    鼠标点击 实现 浮动文字 效果

    欢迎去我的网站看效果
    http://www.yidians.top


    image.png

    其实 你只需要把 这些代码复制到 你想展示的 html 里面就行

    image.png
    <!-- 鼠标点击现实话 -->
     <script type="text/javascript" src="js/jquery.min.2.0.js"></script>
     <script type="text/javascript">
         document.body.oncontextmenu=document.body.ondragstart= document.body.onselectstart=document.body.onbeforecopy=function(){return false;};
     </script>
     <script type="text/javascript">
         /* 鼠标特效 */
         var a_idx = 0;
         // jQuery(document).ready(function($) {
         document.ready = function() {
             $("body").click(function(e) {
                 var a = new Array(
         "主耶稣爱你,朋友!",
                  "约翰福音 3:16  神爱世人,甚至将祂的独生子赐给他们,叫一切信入祂的,不至灭亡,反得永远的生命。", 
                  "提摩太前书 2:4  祂愿意万人得救,并且完全认识真理",
                  "约翰福音 8:32 你们必认识真理,真理必叫你们得以自由。",
                  "使徒行传 2:21  那时,凡呼求主名的,就必得救。",
                  "马可福音 16:16 信而受浸的必然得救,不信的必被定罪。",
                  "希伯来书 11:1 信就是所望之事的质实,是未见之事的确证。",
                  "马太福音 16:26 人若赚得全世界,却赔上自己的魂生命,有什么益处?人还能拿什么换自己的魂生命?",
                  "马太福音 16:25 因为凡要救自己魂生命的,必丧失魂生命;凡为我丧失自己魂生命的,必得着魂生命。",
                  "马太福音 11:28 凡劳苦担重担的,可以到我这里来,我必使你们得安息。",
                  "约翰一书 1:9 我们若认自己的罪,神是信实的,是公义的,必要赦免我们的罪,洗净我们一切的不义。",
         "罗马书 8:6 因为心思置于肉体,就是死;心思置于灵,乃是生命平安。",
         "箴言 4:23 你要切切保守你心,因为生命的果效发之于心。",
         "加拉太书 2:20 我已经与基督同钉十字架;现在活着的,不再是我,乃是基督在我里面活着;并且我如今在肉身里所活的生命,是我在神儿子的信里,与祂联结所活的,祂是爱我,为我舍了自己。",
                  );
                 var $i = $("<span/>").text(a[a_idx]);
                 a_idx = (a_idx + 1) % a.length;
                 var x = e.pageX,
                     y = e.pageY;
                 $i.css({
                     "z-index": 999999999999999999999999999999999999999999999999999999999999999999999,
                     "top": y - 20,
                     "left": x,
                     "position": "absolute",
                     "font-weight": "bold",
                     "font-size": "18px",
                     "color": "#ff6651"
                 });
                 $("body").append($i);
                 $i.animate({
                         "top": y - 180,
                         "opacity": 0
                     },
                     5000,
                     function() {
                         $i.remove();
                     });
             });
         };
     </script>
    

    相关文章

      网友评论

          本文标题:鼠标点击 实现 浮动文字 效果

          本文链接:https://www.haomeiwen.com/subject/naxmpctx.html