本文实例讲述了jQuery实现通过方向键控制div块上下左右移动的方法。分享给大家供大家参考,具体如下: 在CSS中当DOM元素的position属性为absolute或relative时,我们可以通过改变这个元素的left和top属性的具体值来控制元素在页面中显现的位置。 利用上述属性,我们可以简单实现一个元素在页面中的移动效果,这里我们采用JQuery的animate方法来实现动画效果,利用keydown监听方向键按下的事件(这里采用keydown而不是keyup,是为了...
本文实例讲述了jQuery实现的点击标题文字切换字体效果。分享给大家供大家参考,具体如下: 这个主要通过判断被点击的元素的子元素中是否包含了b元素来进行字体的切换,其中wrapInner函数是为了在$author元素的内部添加b标签。 切换回正常字体是通过将内容转化为纯文本形式,再替换元素内容来实现的。 核心代码如下: $(#f-author).css(cursor,pointer); $(#f-author).click(function(event){var $author = $(this);if(!$author.chi...
本文实例讲述了jQuery实现DIV响应鼠标滑过由下向上展开效果。分享给大家供大家参考,具体如下: 鼠标浮动时div由下向上缓慢展开效果 1. 演示效果(鼠标浮动时div由下向上展开,浮动后div由上向下折叠恢复原样)2. 代码 <!doctype html> <html> <head> <meta charset="utf-8"> <title>www.gxlcms.com jQuery响应鼠标实现div由下向上展开</title> <style type="text/css">.big{position:relative; width:234px; height:300px; backgr...
本文实例讲述了jQuery实现鼠标滑过商品小图片上显示对应大图片功能。分享给大家供大家参考,具体如下: 1 . 效果截图2 . 代码 <!doctype html> <html> <head> <meta charset="utf-8"> <title>www.gxlcms.com jQuery图片变换</title> </head> <style type="text/css">.show{width:330px; height:auto; margin:50px auto; background:#eee}.item{background:#fff; width:300px; height:auto; float:left; margin:15px;}p{ padding:15...
本文实例讲述了jQuery实现的手动拖动控制进度条效果。分享给大家供大家参考,具体如下: 这是一个手动控制进度条的小程序,分享给大家: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>www.gxlcms.com jQuery手动拖动进度条...
目前Javascript的测试工具很多,但是针对React的测试策略,Facebook推出的ReactJs标配测试工具是Jest.Jest的官网地址:https://facebook.github.io/jest/。我们可以看到Jest官网宣称的是:Painless JavaScript Testing。是Facebook用于测试服务和React应用程序的JavaScript单元测试框架。 所谓单元测试也就是对每个单元进行测试,通俗的将一般针对的是函数,类或单个组件,不涉及系统和集成。单元测试是软件测试的基础测试。Jest主...
在使用vue-cli创建项目的时候,会提示要不要安装单元测试和e2e测试。既然官方推荐我们使用这两个测试框架,那么我们就动手去学习实践一下他们吧。简介 Karma Karma是一个基于Node.js的JavaScript测试执行过程管理工具(Test Runner)。该工具在Vue中的主要作用是将项目运行在各种主流Web浏览器进行测试。换句话说,它是一个测试工具,能让你的代码在浏览器环境下测试。需要它的原因在于,你的代码可能是设计在浏览器端执行的,在no...
闲来无事,用JS写了一个简单的测试目录网站打开速度的小东西,注意这个只是本机打开目录网站的速度,不代表其它用户的打开也是这个速度,实际上也可用于测试本地网络速度 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />...
以ffmpeg为核心,包装一款局域网内接收转码并推送互联网的客户端软件。本文仅使用ffmpeg基础功能,拉流、转码、推流及简单播放设置。 工作流程拉取远端视频流,视频流格式为 rtsp转换为常用播放格式 rtmp推送至播放端口 rtmp://您的推送端地址,用户使用播放软件连接该地址后可以直接进行内容播放所需工具及软件1、ffmpeg 命令行工具官网链接,选择它的优势在于: 免费无需安装,很大的减少用户操作复杂度命令行启动调用2、nodejs 版本号...
本文实例讲述了jQuery实现的页面遮罩层功能。分享给大家供大家参考,具体如下: <!DOCTYPE html> <html><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"><meta name="apple-mobile-web-app-capable" content="yes"><meta name="apple-mobile-web-app-status-bar-style" content="black"><meta name="description" content="aportpower"/...
前言 对于NodeJS, assert模块提供了一系列的断言测试,其实这个模块主要倾向于内部使用,但是也能被用于项目中, 可以通过require(‘assert)的方式引入,下面本文将给大家介绍关于Node.js用断言模块assert进行单元测试的相关内容,分享出来供大家参考学习,下面话不多说了,来一起看看详细的介绍吧。 方法如下: 首先先引入断言assert模块 var assert = require(assert);1.assert(value, message), assert.ok(value, [message]) //判...
最近在研究vue组件的学习,给自己留个笔记,也分享给大家,希望能对大家有所帮助<!DOCTYPE html> <html><head><meta charset="utf-8"><title>Vue 测试实例-组件嵌套二种方式</title><script src="//cdn.bootcss.com/vue/2.1.10/vue.js"></script> </head><body><div id="app"><Itemlist1><Item v-for="item in items1" :data="item"/></Itemlist1><Itemlist2 :itemlist="items2"></Itemlist2></div><script>Vue.component(Item,{te...
前言 最近发现一个问题,vue-cli 提供的官方模板确实好用。但一直用下来手贱毛病又犯了,像穿了别人的内衣,总感觉不舒服。 所以有机会就瞎倒腾了一遍,总算把各个流程摸了一把。这里分享一下配置带覆盖率的单元测试。分享出来供大家参考学习,话不多少了,来一起看看详细的介绍: 一、文件结构 基本的文件结构。 ├─src │ ├─assets │ ├─components │ ├─app.vue │ └─main.js ├─test │ └─unit │ ├─coverage │...
前言Javascript是一门基于对象的动态语言,也就是说,所有东西都是对象,一个很典型的例子就是函数也被视为普通的对象。Javascript可以通过一定的设计模式来实现面向对象的编程,其中this “指针”就是实现面向对象的一个很重要的特性。本文将给大家详细介绍关于Javascript中this关键字指向的相关内容,让我们先做一个小测试,如果全部答对了,恭喜你不用往下看了。测试题目 第一题<script>var str = zhangsan;function demo() {va...
直接打开html文件,是以file:///方式打开的,这种方式很多时候会遇到跨域的问题,因此我们一般会搭建一个简易的本地服务器,来运行测试页面。 一、构建静态服务器 1、使用express模块 建立个js文件,命名server,内容代码如下: var express = require(express); var app = express(); var path = require(path);//指定静态资源访问目录 app.use(express.static(require(path).join(__dirname, public))); // app.use(express.stat...