随笔分类 - javascript在路上
记录在javascript学习中的点点滴滴
摘要：rpx是微信小程序新推出的一个单位，按官方的定义，rpx可以根据屏幕宽度进行自适应，在rpx出现之前，web页面的自适应布局已经有了多种解决方案，为什么微信还捣鼓出新的rpx单位？在解释这个单位前，我们先简单了解一下目前的主流的自适应布局解决方案： 响应式（Responsive web design
阅读全文
摘要：1，今天发现jquery获取的dom对象除了jquery对象外，还可以访问原来的对象，只要加一个[]就行了，原来还有这样的功能，之前没仔细研究。2，用了first-child,nth-child(n)，获取元素集合里面的第几个元素。3，用Jquery访问nodeText节点，通过访问原来的对象，nextSibling访问。访问是nextSibling.nodeValue;<!DOCTYPE HTML><html> <head> <meta http-equiv="Content-Type" content="text/ht
阅读全文
摘要：这个功能是很久之前实现的，现在发上来，很长一段时间没更新博客了，真惭愧。这个JS代码还有很多修改的空间，先发上来，以后再发个更新的版本吧。这是效果图：【HTML代码】【js】【CSS】调用方法：tabs.set("nav","menu_con");代码下载 点击这里只实现了点击切换的效果。
阅读全文
摘要：【实例演示】 前几天用jquery做了一个JS的图片轮播效果，现在用原生的javascript代码实现同样的功能，当练习用吧，代码写得不是很满意。看到BlueDream在他博客上写的javascript仿QQ滑动菜单的效果，代码实在是优雅，相比较差别一下就凸显了，下次再把他代码的精髓偷过来，嘿嘿。【原理简述】html和css跟JQuery实现图片轮播效果里面的一样，略去。主要是几个公共函数，渐显和渐失，用闭包实现。至于主体逻辑部分，非常一般。【程序源码】贴几个公共函数算了，fadeIn,渐显,fadeOut,渐失代码 function id(name) {return document.get
阅读全文
摘要：【实例演示】1234 用JQuery操作DOM确实很方便，并且JQuery提供了非常人性化的API应付我们的各种需求，其中选择器在此示例-“JQuery实现图片轮播效果”上体现的尤为出色。大大简化了js的代码。【原理简述】这里大概说一下整个流程：1，将除了第一张以外的图片全部隐藏，2，获取第一张图片的alt信息显示在信息栏，并添加点击事件3，为4个按钮添加点击侦听，点击相应的按钮，用fadeOut，fadeIn方法显示图片4，设置setInterval，定时执行切换函数【代码说明】filter(":visible") :获取所有可见的元素unbind()：从匹配的元素中删除
阅读全文
摘要：先看效果：javascript放大镜效果在博客园里面已经有不少同行做过了，我这篇随笔其实也是大量参考了他们的代码，特别是Hellen.Li 博客《JavaScript图片放大镜效果》的代码，写得非常好，我主要也是以它的代码为蓝本加以改进，对其在chrome的bug做了改正。同时取消了对怪异模式的兼容（个人觉得没必要），对mouseout的问题也用了另外一套解决方法，不能说优化，只是这种做法个人比较...
阅读全文
摘要：在上一篇《一个拖拽的效果类和dom-drag.js浅析》中，我大概介绍了dom-drag的拖拽功能，这次我们用dom-drag来实现flash上比较常用的滚动条效果。效果如下：实际效果，请狠狠点击这里。这是实现文字滚动功能的代码，其中需要导入dom-drag类和addEvent类代码其中稍为复杂的是缓动的部分：addY是求出滑块移动的距离对应滚动区域移动的距离，currentY则是最终要移动的y坐...
阅读全文
摘要：最近完成了一个Drag类，可以实现指定对象的拖拽效果。效果如下点击拖拽点击拖拽这是个功能非常简单的类，只实现了拖拽的功能，当然，代码也因此保持了原始的简洁，下面是这个类库的代码：由于代码不是很复杂，所以就不详细展开说了。有需要的可以直接下载使用，导入后用Drag.initDrag(id名称)方法就可以应用了。事实上，网上已经有一个轻量级的dom-drag类库（作者： Aaron Boodman）,...
阅读全文
摘要：这两天在博客园里面看到一篇关于javascript原型和继承的文章：《前端开发必须知道的JS（一） 原型和继承》（作者：JayChow），对JS的原型和继承进行了详尽的分析，我看了大受启发，但是有些地方还是理解不透彻，后来在javaeye上看到《浅析Javascript原型继承》后，终于对javascript的原型机制有了较透彻的理解。 将这两篇文章结合起来，基本可以弄懂JS一大难点了，在此特别感...
阅读全文
摘要：距离某天还有天这次主要测试了几个主要的对象，包括string,date,数组。用date对象做了个类似倒计时的功能，呵呵[代码]"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-...
阅读全文
