社会主义核心价值观js代码
效果如下:
代码如下:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>社会主义核心价值观</title>
</head>
<body>
<!-- div用来撑高body -->
<div style='height: 100vh;'>点击鼠标试试</div>
</body>
<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>
<script>
// 社会主义核心价值观
var a_idx = 0;
$("body").click(function(e) {
var a = new Array(
"富强", "民主", "文明", "和谐",
"自由", "平等", "公正", "法治",
"爱国", "敬业", "诚信", "友善"
);
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": 144469,
"top": y - 20,
"left": x,
"position": "absolute",
"font-weight": "bold",
"color": "#f00"
});
$("body").append($i);
$i.animate({
"top": y - 180,
"opacity": 0
},
1500,
function() {
$i.remove()
})
});
</script>
</html>
社会主义核心价值观js代码的更多相关文章
- 笔记-爬虫-js代码解析
笔记-爬虫-js代码解析 1. js代码解析 1.1. 前言 在爬取网站时经常会有js生成关键信息,而且js代码是混淆过的. 以瓜子二手车为例,直接请求https://www.guaz ...
- 最新的JavaScript核心语言标准——ES6,彻底改变你编写JS代码的方式!【转载+整理】
原文地址 本文内容 ECMAScript 发生了什么变化? 新标准 版本号6 兑现承诺 迭代器和for-of循环 生成器 Generators 模板字符串 不定参数和默认参数 解构 Destructu ...
- 最新的JavaScript核心语言标准——ES6,彻底改变你编写JS代码的方式!
原文地址 迁移到:http://www.bdata-cap.com/newsinfo/1741515.html 本文内容 ECMAScript 发生了什么变化? 新标准 版本号6 兑现承诺 迭代器和f ...
- ReactMix框架,让你实现一套js代码,基于ReactNative在H5,App都能完美跑起来,Write Once,Run Anywhere
ReactNative框架推出已经有一段时间了,相信很多小伙伴都在尝试实现Write Once, Run Anywhere的梦想,比如淘宝的ReactWeb等等,但是这些框架都局限于因为ReactNa ...
- 使用seajs来引入js代码
注意的是:引入jquery的代码最好放在html文件中,本文是为了说明seajs中require如何使用的,才将jquery放入seajs中的. html中对应的代码: <script type ...
- 不到30行JS代码实现的Excel表格
不到30行JS代码实现的Excel表格,jQuery并非不可替代 某国外程序员展示了一个由原生JS写成不依赖第三方库的,Excel表格应用,有以下特性: 由不足30行的原生JavaScript代码实现 ...
- JS 代码调试经验总结(菜鸟必读)
前言:不知不觉写了很多,希望你能耐心看完这篇文章 任何一个编程者都少不了要去调试代码,不管你是高手还是菜鸟,调试程序都是一项必不可少的工作.一般来说调试程序是在编写代码之后或测试期修改Bug 时进行的 ...
- php课程 1-3 web项目中php、html、js代码的执行顺序是怎样的(详解)
php课程 1-3 web项目中php.html.js代码的执行顺序是怎样的(详解) 一.总结 一句话总结:b/s结构 总是先执行服务器端的先.js是客户端脚本 ,是最后执行的.所以肯定是php先执行 ...
- 17-Python执行JS代码--PyExecJS、PyV8、Js2Py
一.Python执行JS代码--PyExecJS.PyV8.Js2Py 1.1.PyExecJS PyExecJS的优点是您不需要照顾JavaScript环境.特别是,它可以在Windows环境中运行 ...
随机推荐
- Ubuntu自定义终端窗口位置
方法一: 自定义终端启动快捷键 具体方法是自定义一个快速启动终端的快捷键,附带设置终端启动时的位置参数.首先获得需要放置窗口的目标位置信息,可以通过终端命令“ xwininfo ”来获得.步骤是首先打 ...
- transparent 透明效果
background-color:transparent;就是把背景色设置为透明. 实际上background默认的颜色就是透明的属性.所以写和不写都是一样的 span{ width: 0; heig ...
- listen系统调用
/* * Perform a listen. Basically, we allow the protocol to do anything * necessary for a listen, and ...
- javascript按照指定格式获取上一个月的日期
//get pre month//get pre month function getPreMonth() { var date=new Date().Format("yyyy-MM-dd& ...
- 04 Effective Go 高效的go语言 重点内容
Effective Go 高效的go语言 Introduction 介绍 Examples 例子 Formatting 格式 Commentary 评论 Names 名字 Package names ...
- Mat结构
主要是记录一下大牛的博客,再次感谢这些无私的博主. 这篇博客http://blog.csdn.net/yang_xian521/article/details/7107786中,我觉得要注意的是Mat ...
- Centos之其他帮助命令
选项帮助 命令 -help 获取命令选项的帮助 例如 ls --help 我们会发现用这种方式查看帮助命令 居然还有中文解释: 详细命令帮助info info 命令 -回车:进入子帮助页面(带有*号标 ...
- 20155309 《Java程序设计》实验三(Java面向对象程序设计)实验报告
一.实验内容及步骤 (一)编码标准 在IDEA中使用工具(Code->Reformate Code)把代码重新格式化. (二)在码云上把自己的学习搭档加入自己的项目中,确认搭档的项目加入自己后, ...
- Flask SQLAlchemy & model
Flask-SQLAlchemy Flask-SQLAlchemy库让flask更方便的使用SQLALchemy,是一个强大的关系形数据库框架,既可以使用orm方式操作数据库,也可以使用原始的SQL命 ...
- TreeMap和TreeSet在排序时如何比较元素?Collections工具类中的sort()方法如何比较元素?
TreeSet要求存放的对象所属的类必须实现Comparable接口,该接口提供了比较元素的compareTo()方法,当插入元素时会回调该方法比较元素的大小.TreeMap要求存放的键值对映射的键必 ...