Welcome

首页 / 脚本样式 / JavaScript

原生js图片轮播效果实现代码

2017-02-06 23
现在很多javascript的插件都可以实现图片轮播的功能，这篇文章，主要是通过这个domo来解析javascript图片轮播的原理。老规矩，先上代码。至于代码中的图片，随便找三张即可，最核心的还是理解其思想。html：<！DOCTYPE html> <html><head> <meta charset="utf-8" /> <title>滚动图</title> <link re...

JavaScript实现窗口抖动效果

2017-02-06 20
原理介绍 抖动其实是往复运动的一种特殊形式，只不过往复运动是一种无摩擦力的无限运动，且以速度为参照依据；而抖动以位置作为参照依据，最终停在起始点 在网页中最常见的一种抖动效果应该是窗口抖动提示了 抖动元素从起始点开始，先向右移动最大距离len，然后移动到对称的左边位置；然后再向右移动稍微小一点的距离，再移动到对称的左边位置；以此循环，最终元素停止在起始点代码实现 抖动在代码实现上，无非就是通过定时器，每隔一段时间让left或top值进行变化 在运...

一个极为简单的requirejs实现方法

2017-02-06 20
require和 sea的源码分析，我之前的博客有写过， 今天我想分享的是一个很简单的核心代码（不带注释和空行大概60行）， 没有容错判断。require.jsrequire函数实现用一句话概括：依次加载require的模块，然后监测script的onload事件，判断所有模块加载成功，执行require的callback， 如果只带一个参数且不是数组，就是加载成功后return 模块。//标记已经加载成功的个数var REQ_TOTAL = 0;//模块...

利用Angular.js限制textarea输入的字数

2017-02-06 21
前言大家可能都遇到过在输入的时候做出限制的需求，本文介绍的是通过Angular.js限制textarea输入字数的方法，有需要的朋友们可以参考以下实例。实例代码如下<！DOCTYPE html><html><head><meta charset="utf-8" /><title>AngularJS 简单应用程序--输入字数限制</title><！-- @author:sm @em...

javascript淘宝主图放大镜功能

2017-02-06 20
工欲善其事，必先利其器。想要实现某一种效果，我们必须要先了解其中的原理。放大镜的功能就是通过获取鼠标在小图中的位置，然后根据大小图的尺寸比例换算出大图需要显示的部分，然后使用定位让大图要显示的部分出现在右边的边框内。然后看代码，根据代码看讲解会更容易理解。html部分<！DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><title&g...

关于RequireJS的简单介绍即使用方法

2017-02-06 21
RequireJS介绍 RequireJS 是一个JavaScript模块加载器。它非常适合在浏览器中使用。使用RequireJS加载模块化脚本将提高代码的加载速度和质量。兼容性 浏览器（browser）是否兼容IE 6+兼容 ✔Firefox 2+兼容 ✔Safari 3.2+兼容 ✔Chrome 3+兼容 ✔Opera 10+兼容 ✔优点实现js文件的异步加载，避免网页失去响应管理模...

Javascript的动态增加类的实现方法

2017-02-06 19
1.我们可以为每一个实例对象增加方法。也就是说我们在每次使用‘类"之外的方法时候，都需要创建一次。function Dog（）{ window.alert（"I am a dog！"）; } var dog1=new Dog（）;//实例化一个对象//现在由于类Dog功能单一，无法满足对象dog1的需要，现在就要考虑为对象dog1新增加一个方法 function eat（）{ window.alert（"I like eat bone！"）;}dog1...

Bootstrap 网站实例之单页营销网站

2017-02-06 21
我们已经掌握了很多实用 Bootstrap 的重要技能。现在，是时候拿出更多的创意来帮助客户实现他们全方位在线营销的愿望了。此次将带领大家做一个漂亮的单页高端营销网站。主要任务如下：□ 一个大型介绍性传送带图片展示区，配有自定义的响应式欢迎信息；□ 一个客户留言区，显示为带标题的图片墙，就像砖垒的一样；□ 一个功能清单，使用大号 Font Awesome 图标；□ 一个带有自定义价目表的注册区；□ 一个带动态滚动的 ScrollSpy 导航条。1.概况有一...

yarn与npm的命令行小结

2017-02-06 24
一、首先需要了解的命令 npm install === yarn —— install 安装是默认行为。 npm install taco --save === yarn add taco —— taco 包立即被保存到 package.json 中。 npm uninstall taco --save === yarn remove taco在 npm 中，可以使用 npm config set save true 设置 — -save 为默认行为，但这...

JS中动态创建元素的三种方法总结（推荐）

2017-02-06 23
1、动态创建元素一 document.write（）例如向页面中输出一个 li 标签<pre class="html" name="code"><span style="font-size:12px;"><script>document.write（"<li>123</li>"）;</script></span>body标签中就会插入但是这种方法几乎不用，因为这回影响页面的...

jQuery动态创建元素以及追加节点的实现方法

2017-02-06 20
我们知道js中有三种动态创建元素的方法，jQuery中也可以动态的创建元素例如： var str = $（"<a href="http://www.jb51.net">脚本之家</a>"）; $（"ul"）.append（str）; //将动态创建的str元素追加到ul下面追加节点在js当中追加节点的方法是appendChild（节点元素）和insertBefor（节点元素，位置），在jQuery中是append 追加在父元素的最后...

angular源码学习第一篇 setupModuleLoader方法

2017-02-06 20
angular源码其实结构非常清晰，划分的有条有理的，大概就是这样子：（function（window,document,jquery,undefined）{ //一些工具函数 //EXPR 编译器 自执行 //setupModuleLoader方法，公司内部的框架是vxsetup方法，（只是定义，没有调用） //moduler方法（） //angular初始化方法，公司内部的框架是vxinit方法 //bootstrap //createInjector...

详解javascript事件绑定使用方法

2017-02-06 19
由于html是从上至下加载的，通常我们如果在head部分引入javascript文件，那么我们都会在javascript的开头添加window.onload事件，防止在文档问加载完成时进行DOM操作所出现的错误。如果有多个javascript文件，那么极有可能出现多个window.onload事件，但是最后起作用的只有一个，这时候就需要使用事件绑定来解决这个问题了。IE方式attachEvent（事件名称, 函数），绑定事件处理函数detachEvent（...

浅谈JS中String（）与 .toString（）的区别

2017-02-06 20
我们知道String（）与 .toString（）都是可以转换为字符串类型，但是String（）与 .toString（）的还是有区别的1、.toString（）可以将所有的的数据都转换为字符串，但是要排除null 和 undefined例如将false转为字符串类型<script>var str = false.toString（）;console.log（str, typeof str）;</script>返回的结果为 fals...

js阻止冒泡和默认事件（默认行为）详解

2017-02-06 20
本文实例为大家分享了js阻止冒泡和默认事件方法，供大家参考，具体内容如下阻止冒泡。冒泡简单的举例来说，儿子知道了一个秘密消息，它告诉了爸爸，爸爸知道了又告诉了爷爷，一级级传递从而引起事件的混乱，而阻止冒泡就是不让儿子告诉爸爸，爸爸自然不会告诉爷爷了。下面的domo就是很好的例子。<！DOCTYPE html> <html><head> <meta charset="UTF-8"> <title>&...

js设置和获取自定义属性的方法

2017-02-06 22
Js操作自定义属性的方法：var testEle = document.getElementByIdx_x（"test"） testEle.setAttribute（"test","aaa"）; // 设置 testEle.getAttribute（"test"）； //获取testEle.attributes["test"].nodeValue; // 获取Jquery操作自定义属性的方法：$（"#test"）.attr（"test","aaa"） //...

javascript匀速动画和缓冲动画详解

2017-02-06 22
关于网页中的动画，在css3中我们已经可以使用一些属性快速的做出来，但是有时候为了浏览器的兼容性我们还是需要使用js来制作网页中的动画。使用js做动画最重要的一个函数就是setInterval函数，这里不再赘述，不懂可以直接百度用法。本文主要讲动画的原理已经在制作过程中的要点。老规矩，先上代码，能直接看懂的可以节省时间。html部分：<！DOCTYPE html> <html lang="en"> <head> <...

Javascript 创建类并动态添加属性及方法的简单实现

2017-02-06 18
JavaScript 是一种很强的面向对象的语言，支持创建实例之后再添加属性和方法，虽然是小技巧，用的时候容易忘记，今天写了一个很小的例子，记录在这里，仅供参考。function MyClass（） {//This function is same as a constructeralert（"New Object Created"）;} //Creating Objectvar MyObject = new MyClass （）;NewObject.pr...

探究Vue.js 2.0新增的虚拟DOM

2017-02-06 20
你可能早就已经听说了 Vue.js 2.0。一个主要的令人兴奋的新特性就是更新页面的"虚拟DOM"的加入。虚拟 DOM 可以做什么？React 和 Ember 都使用了虚拟DOM来提升页面的刷新速度。为了理解其如何工作，让我们先讨论一下几个概念：更新DOM的花费时间非常长当我们使用 JavaScript 来改变页面的时候，浏览器不得不做一些工作来找到需要的DOM节点，并且做出类似这样的改变：document.getElementById（"myId"）.a...

Vue.js Ajax动态参数与列表显示实现方法

2017-02-06 22
Vue.js简介vue是法语中视图的意思，Vue.js是一个轻巧、高性能、可组件化的MVVM库，同时拥有非常容易上手的API。一、动态参数显示 ajax异步请求后，接收到返回的data参数并显示在前端1.1 引入js，也加入了jQuery<script type="text/javascript" src="/js/vue.min.js"></script><script type="text/javascript" src=...
<< 81 82 83 84 85 86 87 88 89 90 >>
版权所有©石家庄振强科技有限公司2024 冀ICP备08103738号-5 网站地图