点击心形

点击心形(放在页脚html处)

<script type="text/javascript">
/* 鼠标特效 */
var a_idx = 0;
jQuery(document).ready(function($) {
    $("body").click(function(e) {
        var a = new Array("?富强?","?民主?","?文明?","?和谐?","?自由?","?平等?","?公正?","?法治?","?爱国?","?敬业?","?诚信?","?友善?");
        var $i = $("<span></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",
            "color": "rgb("+~~(255*Math.random())+","+~~(255*Math.random())+","+~~(255*Math.random())+")"
        });
        $("body").append($i);
        $i.animate({
            "top": y - 180,
            "opacity": 0
        },
        1500,
        function() {
            $i.remove();
        });
    });
});
</script>

原文地址:https://www.cnblogs.com/bsth/p/10219259.html

时间: 2024-07-31 09:31:43

点击心形的相关文章

超多经典 canvas 实例,动态离子背景、移动炫彩小球、贪吃蛇、坦克大战、是男人就下100层、心形文字等等等

超多经典 canvas 实例 普及:<canvas> 元素用于在网页上绘制图形.这是一个图形容器,您可以控制其每一像素,必须使用脚本来绘制图形. 注意:IE 8 以及更早的版本不支持 <canvas> 元素. 贴士:全部例子都分享在我的 GayHub - https://github.com/bxm0927/canvas-special 尤雨溪个人主页炫彩三角纽带效果,点击还可变换 GitHub源码 . Demo演示 知乎登录注册页动态离子背景效果 GitHub源码 . Demo演

[deviceone开发]-直播APP心形点赞动画示例

一.简介 这个示例展示do_Animator组件的简单使用,通过点击"点赞"按钮,不断弹出心形图片,向上动画漂移到顶部消失.间隔时间和上下左右移动的步长都是一定范围的随机值. 二.效果图 三.相关下载 https://github.com/do-project/code4do/tree/master/my_heart 四.相关讨论 http://bbs.deviceone.net/forum.php?mod=viewthread&tid=308 五.更多案例 http://so

[deviceone开发]-心形点赞动画示例

一.简介 这个示例展示do_Animator组件的简单使用,通过点击"点赞"按钮,不断弹出心形图片,向上动画漂移到顶部消失.间隔时间和上下左右移动的步长都是一定范围的随机值.二.效果图 三.相关下载 https://github.com/do-project/code4do/tree/master/my_heart四.相关讨论 http://bbs.deviceone.net/forum.php?mod=viewthread&tid=308五.更多案例http://source

心形进度条

废话不多说,先上效果图: 这个进度就是模拟心形填充的过程 实现原理是:首先将空心形图片绘制出来,然后根据进度大小再将实心的心形图片一部分一部分的绘制出来.也就是两张完全相同大小的空心图和圆心图重叠绘制,利用canvas的clipRect绘制实心部分,实现进度条效果. 首先在res->values先新建一个文件atrrs.xml,然后定义两个属性 <?xml version="1.0" encoding="utf-8"?> <resources

proteus仿真51流水灯和点阵(心形)

使用SDCC,不能简单套用keil环境下的语法,以下是SDCC中8051.h头文件与keil环境下reg51.h头文件的区别: 关于如何在proteus上调用在codeblocks上编写好的C51代码: 在proteus上双击51单片机或右击51单片机点击编辑属性 浏览到codeblocks编译后的hex文件即可. 现在开始流水灯: 原理图: 代码: #include <mcs51/8051.h> void delay() { for(int i=0;i<100;i++) for(int

CSS实现跳动的心形图案?

原理: 1. 创建1个div <div class="heart"></div> .heart { position:relative; width: 100px; height: 100px; margin: 100px auto; background-color: tomato; } 2. 用伪元素:before和:after,画出一个粉色的圆和一个黄色的圆,并将圆心分别定位在正方形的左边和上边. 注意: 设置:before和:after时必须设置其con

心形动画

<!doctype html><html><head><meta charset="utf-8"><title>心形动画代码</title><script src="http://libs.baidu.com/jquery/1.11.3/jquery.min.js"></script><style>body { background:black;}.heart

[控件] 心形加载的view

心形加载的view 效果: 素材图片: 源码: StarView.h 与 StarView.m // // StarView.h // Star // // Created by XianMingYou on 15/3/13. // Copyright (c) 2015年 XianMingYou. All rights reserved. // #import <UIKit/UIKit.h> @interface StarView : UIView @property (nonatomic,

用循环制作的 心形图案

class Program { static void Main(string[] args) { Console.WriteLine("输入4-15的数可以出现不同的心"); Console.WriteLine("输入“q”或“Q”退出"); Console.WriteLine("请输入:"); string s = Console.ReadLine(); //判断用户输入的是否是q while (s.ToUpper() !="Q&q