使用<audio>和<video>元素的play()和pause()方法,可以手工控制媒体文件的播放。组合使用属性、事件和这两个方法,很容易创建一个自定义的媒体播放器,如下面的例子所示。 1<div class="mediaplayer"> 2<div class="video"> 3<video id="player" src="movie.mov" poster="mymovie.jpg" 4 width="300" height="200"> 5 Video player not available.6</video> 7</div> 8<div class="controls"> 9<input type="button" ...
“通过事件机制,可以将类设计为独立的模块,通过事件对外通信,提高了程序的开发效率。” 可以把多个关联但逻辑复杂的操作利用自定义事件的机制灵活地控制好对象之间通过直接方法调用来交互1)对象A直接调用对象B的某个方法,实现交互;直接方法调用本质上也是属于一种特殊的发送与接受消息,它把发送消息和接收消息合并为一个动作完成;方法调用方和被调用方被紧密耦合在一起;因为发送消息和接收消息是在一个动作内完成,所以无...
转载:http://blog.sina.com.cn/s/blog_610f47c50100ohe4.html原理其实很简单:首先绘制弹出的自定义对话框,将其使用display:none隐藏,因为设置为none,其在页面中并不占用空间;遮蔽罩使用一个div,然后将其宽高设置为整个显示窗口大小,配置其透明度,在将其z-index属性大于主页面的z-index的值,也就是遮蔽层在主页面上方,如此即可 事先隐藏一个div,在需要的时候调出显示既可。<!--以下代码从网上多处学习整合而成,由于来源...
1 获取标签属性语法: element.getAttribute(‘属性名‘) 返回对应属性的值 ,如果没有返回null.//html
<div id="box" index="0"></div>//jsvar box = document.getElementById(‘box‘);
var value = box.getAttribute(‘index‘);
console.log(value) // 02 设置自定义属性的值语法: element.setAttribute(‘属性名‘, ‘属性的值‘) 返回undefined//html
<div id="box" ></div>//jsvar box = document.getElementById(‘box‘);
b...
function aa1511() { var chengshi="马鞍山"; var shengfen="安徽省"; return shengfen+"@"+chengshi; } function xialachaxun() { var hanshu=aa1511().split("@"); alert(hanshu[0]+‘,‘+hanshu[1]); }原文:http://www.cnblogs.com/smght/p/5266494.html
右键菜单的设定主要是通过contextmenu事件来激活,由于contextmenu事件是冒泡的,所以可以为document来指定事件,进行页面中该事件的统一处理。同时,因为contextmenu是一个鼠标事件,所以在event中包含有鼠标位置等一系列信息,可以通过这个来实现对浏览器右键菜单的模拟。为了兼容现在的主流浏览器,所以先做一个通用的事件加载函数:1function eventHandler(dom,type,fn){
2if(typeof dom.addEventListener != ‘undefined‘){
...
一:自定义对象1.基本概念:①对象:包含一系列无序属性和方法的集合。②键值对:对象中的数据是以键值对的形式存在的,以键取值。③属性:描述对象特征的一系列变量。[对象中的变量]④方法:描述对象行为的一系列方法。[对象中的函数]2. 对象的声明:①字面量声明:var obj={};②new 关键字:var lisi = new Object(); 3.对象中属性和方法的读写方式:①通过.运算符:对象内部:this.属性名 this.方法名(); 对象外部:...
JavaScript 一个最简单的事件模型,需要有事件绑定与触发,也许还要有事件删除。 1var eventModel = {2 list: {},3 4 bind: function () {5var args = [].slice.apply(arguments),6 type = args[0],7 handlers = args.slice(1);8 9if (typeof type === ‘string‘ && handlers.length > 0) {
10for (var i = 0; i < handlers.length; i++) {
11if (typeof handlers[i] === ‘function‘) {
12if (!this.list[type]) {
1...
让我万万没想到的是,原来《JavaScript高级程序设计(第3版)》里面提到的方法已经是过时的了.后来我查看了MDN,才找到了最新的方法.1. 模拟鼠标事件MDN上已经说得很清楚,尽管为了保持向后兼容MouseEvent.initMouseEvent()仍然可用,但是呢,我们应该使用MouseEvent().我们使用如下页面做测试 1 <!DOCTYPE html>2 <html>3 <head lang="zh-CN">4 <meta charset="UTF-8">5 <meta name="viewport" content="width=device-width, initial-s...
$(dom).addEvent("ft", function() {alert("走起");
});// 创建
var evt = document.createEvent("HTMLEvents");
// 初始化
evt.initEvent("ft", false, false);// 触发, 即弹出文字
dom.dispatchEvent(evt);
//type:HTMLEvents MouseEvents(也可以以此来检测是否是移动端) UIEvents document.createEvent(type)
// 初始化,事件类型,是否冒泡,是否阻止浏览器的默认行为event.initEvent(type,false,false)
// 触发
element....
使用微信JSSDK自定义微信分享标题、描述、和图标微信公众号jssdk自定义分享,二次分享自定义失败解决技巧原文:https://www.cnblogs.com/hool/p/12629615.html
function trim(str){//创建空格对象var space = new String(" ");/*str = trimLeft(str,space);str = trimRight(str,space);*/return trimRight( trimLeft(str,space),space);
}//去除左空格function trimLeft(str,space){var i = 0,j = str.length;while(i < j && space.indexOf(str.charAt(i))!=-1){i++;}return str.substring(i,str.length); }//去除右空格function trimRight(str,space){var i = 0,j = str.length;while(j...
在实际项目中,经常由于浏览器自带的滚动条样式太戳,而且在各个浏览器中显示不一样,所以我们不得不去实现自定义的滚动条,今天我就用最少的代码实现了一个自定义滚动条,代码量区区只有几十行,使用起来也非常方便。<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"/><title>自定义滚动条</title><style type="text/css">
body,ul,dl,dd{ margin:0; padding:0; font-size:12px; ...
1//自定义任务 2 module.exports = function (grunt) {3// 项目配置 4var http = require(‘http‘);5var qs = require(‘querystring‘);6var fs=require("fs");7 8function write(name,temp){9 fs.writeFile("./release/"+name,temp,"utf8",function(err){
10if(err){
11 grunt.log.error(‘BODY: ‘ + err);
12 }
13 });
14 }
1516 grunt.initConfig({
17 minJs:{
18 ...
此滚动条仅支持竖向(Y轴)一、Css 1/*这里是让用户鼠标在里面不能选中文字,避免拖动的时候出错*/ 2body { -moz-user-select: none; /*火狐*/ -webkit-user-select: none; /*webkit浏览器*/ -ms-user-select: none; /*IE10*/ -khtml-user-select: none; /*早期浏览器*/ user-select: none; }3 4/*滚动文本及滚动条大框*/ 5.scroll_con { width: 500px; height: 500px; background-color: #5c0af7; position: relative; overflow-y...