Welcome 微信登录

首页 / 脚本样式 / JavaScript

JavaScript 放大镜 放大倍率和视窗尺寸

JavaScript 放大镜 放大倍率和视窗尺寸

对JavaScript 放大镜来说, 计算倍率必不可少. 一个完整的放大镜结构里, 与倍率扯上关系的一共有 4 个对象, 原图, 缩略图, 镜片和视窗. 镜片在缩略图上的覆盖位置, 其实就是视窗对原图的部分展示, 所以它们之间有如下关系. 倍率 = 原图/缩略图 = 视窗/镜片 倍率一般大于等于 1, 因为原图一般都不会小于缩略图. 一旦倍率小于 1, 则将倍率设为 1. 因为缩略图和原图的尺寸是不可变的, 所以我们通过它们来获得倍率.复制代码 代码如下:...
JavaScript 放大镜 移动镜片效果代码

JavaScript 放大镜 移动镜片效果代码

放大镜并不是一个难以实现的效果, 只是因为牵涉到一些精确的数值计算, 显得比较繁琐. 在未来的一段日子, 我会不定期地写关于 JavaScript 放大镜系列的文章, 每次讲一个点, 由点及面, 最后完成整个效果. 本次我们先了解如何在缩略图上移动镜片. (这是 DEMO) 缩略图和镜片组成的 DOM 结构如下. 复制代码 代码如下: <a id="thumb" href="#"> <img src="http://img.alibaba...
JQuery 1.6发布 性能提升,同时包含大量破坏性变更

JQuery 1.6发布 性能提升,同时包含大量破坏性变更

新版本中的部分重要改进:attr()、val()和data()方法有了更好的性能;在attr()方法中支持Boolean属性;添加了钩子函数,允许对attr()和val()方法进行扩展;map()方法添加了对对象的支持(将JavaScript对象的属性映射到函数)允许使用相对值(“+=”,“-=”)更新CSS;添加了deferred.always(), deferred.pipe()方法,减少了代码量,提高了代码易读性;同步动画 – 现在所有动画都同步到相...
Jqyery中同等与js中windows.onload的应用

Jqyery中同等与js中windows.onload的应用

复制代码 代码如下: $(function(){//脚本}) Jquery(function(){//脚本}) Jquery(document).ready(function(){//脚本}) 以上三个代码执行同一个动作,由于书写方便,所以Jquery比其他应用程序更受欢迎,但是当与其他js程序库一起使用的时候,特别是prototype.js同时使用时,不能使用$方法,因为他们也有该方法,可以用如下方法回避这种冲突: jQuery(function($)...
JaveScript中的几个关键概念的理解-原型链的构建

JaveScript中的几个关键概念的理解-原型链的构建

Javascript中所有function中都有一个prototype属性,并且这个prototype属性是一个object类型的对象,所有由该function构造出来的对象都具有这个prototype上的特性,也就是说可以用构造出来的对象直接访问prototype上的属性和方法。 下面一段代码演示prototype的使用方法: 复制代码 代码如下: function Staff(name) { this.name = name; } Staff.prot...
JS Range HTML文档/文字内容选中、库及应用介绍

JS Range HTML文档/文字内容选中、库及应用介绍

一、前面的些话 本文的内容基本上是基于“区域范围对象(Range objects)”这个概念来说的。这个玩意,可以让你选择HTML文档的任意部分,并可以拿这些选择的信息做你想做的事情。其中,最常见的Range是用户用鼠标选择的内容(user selection)。 本文有不少篇幅就是讲如何将用户的这种选择转换为W3C Range或Microsoft Text Range对象。 二、什么是Range? 所谓"Range",是指HTML文档中任意一段内容。一个...
js 中{},[]中括号,大括号使用详解

js 中{},[]中括号,大括号使用详解

一、{ } 大括号,表示定义一个对象,大部分情况下要有成对的属性和值,或是函数。 如:var LangShen = {"Name":"Langshen","AGE":"28"}; 上面声明了一个名为“LangShen”的对象,多个属性或函数用,(逗号)隔开,因为是对象的属性, 所以访问时,应该用.(点)来层层访问:LangShen.Name、LangShen.AGE,当然我们也可以用数组的方式来访问,如:LangShen["Name"]、LangShen[...
JavaScript 继承使用分析

JavaScript 继承使用分析

深入学习javascript继承之前,先了解下面的几个概念: 父类:被继承的类 子类:由继承得来的类 超类:也就是父类 抽象类:一般不用来实例化的类,它的用途是用来给其他类继承. 基类:提供给其他类可以继承的类 派生类:由基类继承而来的类 javascript对象继承通常有下面的5种方式: 1.对象冒充 2.call()方式 3.apply()方式 4.原型链 5.混合方式 A.对象冒充 所谓对象冒充,就是新的类冒充旧的类(旧的类必须采用构造函数方式),从...
基于JQuery的动态删除Table表格的行和列的代码

基于JQuery的动态删除Table表格的行和列的代码

首先要获取Table表格的行数,我是通过后台添加表格的所以我在前台获取的时候length一下就获取到了总数赋值例如上图: 如果我要打印这个表格但不想要操作那列的内容咋办? 复制代码 代码如下: for(var i=0;i<num+1;i++) { $("table tr").eq(i).find("td").eq(0).remove(); } 解释: num是从后台获取到的列表总和+1是为了表头那个也去掉。 第一个eq(i)是获取Table里的...
js 第二代身份证号码的验证机制代码

js 第二代身份证号码的验证机制代码

由于响应速度极快,可以肯定不是联机校验正确性的,那也就是说第二代身份证除了大家都知道的几位表示生日和性别的规则以外,还有另外的自我校验规则。于是翻开页面源码查看,发现这段js没有被压缩,所以规则也很好懂。 就在这里给大家科普下,不知道是不是火星了,呵呵。 以下代码来自这里,版权归盛大。当然,你也可以在维基百科找到更详细的介绍和算法。 复制代码 代码如下: iW = new Array(7,9,10,5,8,4,2,1,6,3,7,9,10,5,8,4,2,...
关于js获取radio和select的属性并控制的代码

关于js获取radio和select的属性并控制的代码

实现目标:1、点击“匿名小组”,自动跳转:成员类型“私密群”、访问控制 “群成员” 2、点击“公开群”, 自动跳转:成员类型“实名小组” 首先是获得点击radio的事件,用的是jquery库,获得事件后判断是那个radio,通过判断是那个radio被checked了然后进行联动变换。其中遇到的问题有,兼容ie和firefox的事件,然后是设置select中的中options的selected属性。 兼容ie和firefox用了var ...
ExtJS4 组件化编程,动态加载,面向对象,Direct

ExtJS4 组件化编程,动态加载,面向对象,Direct

ExtJS4推荐定义类的时候均使用Ext.define,利用xtype动态加载 修改了以前的一个登陆窗口,感觉用官方推荐的方法还是很不错的 但还有一些问题没有想得非常清楚,先把代码贴出来一起研究下。请看代码中的注释~~ 使用Ext+.Net,用Direct模式传递数据 Default.aspx: 复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "htt...
javascript 弹出层组件(升级版)

javascript 弹出层组件(升级版)

这次还是利用原来代码的组织结构重新加强了功能,目前来说还有两个小问题,第一个是ie6下自定义弹出层会出现无法遮住select的情况,目前还没加入到组件里,可以自己在自定义的div里面加上ifame来遮罩,组件自带的弹出层可以遮住。第二个问题,由于是绝对定位,所以在改变浏览器窗口大小的时候会出现无法自动跟随。大家试试就知道了,当然问题肯定不少,只是这两个我认为比较重要的,暂时列出来,以后修复。 下面是代码,里面都有注释,可以直接运行。 在线演示 http:/...
javascript数组去掉重复

javascript数组去掉重复

总得来说面试的过程还是收获了不少,主要是认清自己的差距到底有多大,知识面到底有多窄,适当打击一下自信心还是有必要的。在这里做一次全面的总结,关于javascript的数组去重问题。 考虑一个问题由简到繁相对容易接受一点,首先假设要去重的数组是比较简单的,例如: 复制代码 代码如下: var arr=[1,2,2,3,"5",6,5,""," "] 这个数组只包含了数字,字符串两种类型。我们给数组原型上面添加去重的方法distinct,用第一种很容易想到的...
让innerText在firefox火狐和IE浏览器都能用的写法

让innerText在firefox火狐和IE浏览器都能用的写法

IE中的获取文本方法innerText在firefox中不支持 firefox改成了textContent方法/属性 并且在Firefox中文本中间的空白自符被无情的替换没了 使用起来异常不方便 现在好了,用Javascript重新定义了innerText方法 使得在Firefox中也可以使用innerText方法 并且此方法解决了firefox中空白字符的问题 使用方法: 将下面的脚本放在页面内 不管ie还是firefox都可以使用obj.innerTe...
<< 1891 1892 1893 1894 1895 1896 1897 1898 1899 1900 >>