cloudgamer

摘要： 弹出层就是相对文档或窗口定位的一个层，一般用来显示提示信息、广告等内容，还可以配合覆盖层来锁定页面。 在仿Lightbox效果中，已经基本实现了这个效果，这次主要改进了ie6在fixed时的抖动问题。 此外，还增加了一个用来兼容ie6的fixed的方法，覆盖层也重新“包装”，程序也改成组件的结构。 兼容：ie6/7/8, firefox 3.6.8, opera 10.6, safari 5.0.1, chrome 5.0 阅读全文

摘要： 一般的平面效果，通过改变水平和垂直坐标就能实现，再加上深度，就能在视觉上的产生3D（三维）的效果。 程序就是模拟这样一个三维空间，里面的图片会根据三维坐标显示在这个空间。 很久以前就看过一个3DRoom效果，是用复杂的计算实现的。 在上一篇研究过css3的transform之后，就想到一个更简单的方法来实现。 阅读全文

摘要： 以前要实现图片的旋转或翻转，只能用ie的滤镜来实现，虽然canvas也实现，但ie不支持而且不是html标准。 css3出来后，终于可以用标准的transform来实现变换，而canvas也已成为html5标准的一部分。 css3和html5使web变得越来越强大，各种新奇的技术正等待我们发掘。 本程序分别通过滤镜(ie)、ccs3和canvas来实现图片的旋转、缩放和翻转变换效果，可以用作图片查看器。 有如下特色： 1，用滤镜、ccs3和canvas实现相同的变换效果； 2，可任意角度旋转； 3，可任意角度翻转； 4，可扩展滚轮缩放； 5，可扩展拖动旋转。 兼容：ie6/7/8, firefox 3.6.8, opera 10.6, safari 5.0.1, chrome 5.0 阅读全文

摘要： 滑动展示效果主要用在图片或信息的滑动展示，也可以设置一下做成简单的口风琴（Accordion）效果。 这个其实就是以前写的图片滑动展示效果的改进版，那是我第一篇比较受关注的文章，是时候整理一下了。 有如下特色： 1，有四种方向模式选择； 2，结合tween算法实现多种滑动效果； 3，能自动根据滑动元素计算展示尺寸； 4，也可自定义展示或收缩尺寸； 5，可扩展自动切换功能； 6，可扩展滑动提示功能。 兼容：ie6/7/8, firefox 3.6.8, opera 10.51, safari 4.0.5, chrome 5.0 阅读全文

摘要： 上一篇ImageZoom已经对图片放大效果做了详细的分析，这次在ImageZoom的基础上进行扩展，实现更多的效果。主要扩展了原图和显示框的展示模式，有以下几种模式："follow" 跟随模式：显示框能跟随鼠标移动的效果；"handle" 拖柄模式：原图上有一个拖柄来标记显示范围；"cropper" 切割模式：原图用不透明的来标记显示范围，其他部分用半透明显示；"handle-cropper" 拖... 阅读全文

摘要： 这个效果也叫放大镜效果，最早好像在ppg出现的，之后就有了很多仿制品出来了。一般用于放大查看商品图片，在凡客，京东商城，阿里巴巴等都有类似的效果。好处是能在原图附近对图片进行局部放大查看，而且可以通过鼠标控制查看的部位。前一阵子看到sohighthesky的图片放大效果，心血来潮自己也写一个看看。这个程序有以下特点：1，支持使用原图放大或新图片设置大图；2，大图完成载入前使用原图放大代替，减少操作... 阅读全文

摘要： 之前在做一个图片浏览效果时，要看后面的小图必须等到前面的加载完，而且大图的位置是在大量的小图后面，导致大图要等到小图都加载完才能显示，为了解决这个问题，就想到了Lazyload效果。现在很多网站都用了类似的效果，如淘宝、Bing等。这个图片延迟加载效果是在Lazyload的基础上扩展的，主要扩展了获取img元素，获取src和图片加载的部分。兼容：ie6/7/8, firefox 3.5.5, opera 10.10, safari 4.0.4, chrome 3.0其中safari和chrome部分功能不支持。效果预览图片延迟加载：共有图片 张，未载入 张 程序说明【获取图片】先定义filt 阅读全文

摘要： Lazyload是通过延迟加载来实现按需加载，达到节省资源，加快浏览速度的目的。网上也有不少类似的效果，这个Lazyload主要特点是：支持使用window（窗口）或元素作为容器对象；对静态（位置大小不变）元素做了大量的优化；支持垂直、水平或同时两个方向的延迟。 由于内容比较多，下一篇再介绍图片延迟加载效果。 兼容：ie6/7/8, firefox 3.5.5, opera 10.10, safa... 阅读全文

摘要： 图片上传预览是一种在图片上传之前对图片进行本地预览的技术。使用户选择图片后能立即查看图片，而不需上传服务器，提高用户体验。但随着浏览器安全性的提高，要实现图片上传预览也越来越困难。不过群众的智慧是无限的，网上已经有很多变通或先进的方法来实现。例如ie7/ie8的滤镜预览法，firefox 3的getAsDataURL方法。但在opera、safari和chrome还是没有办法实现本地预览，只能通过... 阅读全文

摘要： 之前写过一个仿163网盘无刷新多文件上传系统，已经对无刷新上传文件的原理做了详细的分析。而这次的系统主要是针对单个file控件的，便携版，使用更简单，还有更深入的分析。ps：flash实现的效果是好得多，但这不是我研究的范围，也没什么可比性。兼容：ie6/7/8, firefox 3.5.5, opera 10.01, safari 4.0.3, chrome 3.012月2号是我女朋友的生日，祝... 阅读全文

摘要： 上一个版本（第一版请看这里）基本实现了多级联动和浮动菜单的功能，但效果不是太好，使用麻烦还有些bug，实用性不高。这次除了修改已发现的问题外，还对程序做了大幅调整和改进，使程序实用性更高，功能更强大。 效果预览菜单使用演示： 位置： 仿京东商城商品分类菜单： 图片动画 图片效果 动画效果系统其他 系统效果 其他效果 图片滑动切换效果图片变换效果(ie only)图片滑动展示效果图片切割效果Twe... 阅读全文

摘要： 本来想做一个集合浮动定位和鼠标跟随的tooltips效果，但发现定位和鼠标跟随在一些关键的地方还是不同的，还是分开来吧。 这个效果本身难度不大，主要在程序结构和扩展中下了些功夫，务求用起来更方便，能用在更多的地方。效果预览 水平位置： left clientleft center clientright right 垂直位置： top clienttop center clien... 阅读全文

摘要： 近来有客户要求用table显示一大串数据，由于滚动后就看不到表头，很不方便，所以想到这个效果。上次做table排序对table有了一些了解，这次更是深入了解了一番，发现table原来是这么不简单。还不清楚这个效果叫什么，有点像表头固定的效果，就叫行定位吧，本来想把列定位也做出来，但暂时还没这个需求，等以后有时间再弄吧。在淘宝的商品搜索页也看到类似的效果，但淘宝的不是table，而是li，而我这个是... 阅读全文

摘要： 序二（09/11/1）近来看了Dean的“Convert any colour value to hex in MSIE”，终于解决了根据关键字获取颜色rgb值的问题。顺便把程序也重新整理一番，并使用了最近整理的工具库。序一（09/03/11）很久没写blog，太忙了。没什么时间写复杂的东西，重新把颜色渐变效果写一遍。关于颜色的效果一般就两个，颜色梯度变化和颜色动态渐变，前... 阅读全文

摘要： Flash做动画时会用到Tween类，利用它可以做很多动画效果，例如缓动、弹簧等等。我这里要教大家的是怎么利用flash的Tween类的算法，来做js的Tween算法，并利用它做一些简单的缓动效果。实例效果Tween类型： Linear Quadratic Cubic Quartic Quintic Sinusoidal Exponential Circular Elastic ... 阅读全文

摘要： 这个滑动条（拖动条）效果，一开始是参考了BlueDestiny的slider和Apple产品展示的样式，做了程序的原型。在做了拖放效果之后，我想应该可以做一个更好的了，所以重做一遍，完善和扩展了一些功能。碍于时间没有做得很强大，都是一些基本功能，希望各位多提意见！效果预览预览效果1：这个是仿Apple滑动条产品展示效果。除了原来的效果（包括点击缓动滑移、拖动滑移），我还加入了本程序特有的滚轮和键盘... 阅读全文

摘要： 拖拉缩放效果，实现通过鼠标拖动来调整层的面积（宽高）大小。例如选框效果。这里的拖拉缩放比一般的选框复杂一点，能设置八个方位（方向）的固定触发点，能设置最小范围，最大范围和比例缩放。跟拖放效果一样，程序的原型也是在做图片切割效果的时候做出来的。但这个效果的参考少的多，基本上靠自己摸索，走了不少弯路，现在总算把自己想要的效果做出来了，程序跟上一个版本比较也已经“面目全非”，还是... 阅读全文

摘要： asp分页系统 阅读全文

摘要： 拖放效果，也叫拖拽、拖动，学名Drag-and-drop ，是最常见的js特效之一。如果忽略很多细节，实现起来很简单，但往往细节才是难点所在。这个程序的原型是在做图片切割效果的时候做出来的，那时参考了好几个同类的效果，跟muxrwc和BlueDestiny学习了不少东西。虽然每次整理都觉得很好了，不过每隔一段时间又会发现得某个地方可以改善，某个地方有错误，某些需求需要实现，就像自己学习的知识那样。... 阅读全文

摘要： Javascript日期下拉菜单 阅读全文

摘要： 这个仿163网盘无刷新多文件上传系统，并没有用使用.net的控件，完全的手工制作。前台基本上是静态的，跟后台没有关系，所以后台用什么语言做都可以（后面有各个版本的实例下载）。本来觉得这个系统会很复杂，但把每个部分都分析清楚后，其实需要的技术并不高。不过当我把各个功能函数都整理好准备进行封装时，却发现要把程序封装不是那么容易，因为程序跟html的耦合度太高。然后我逐步把程序中操作html相关的部分分... 阅读全文

摘要： 序二（09/05/03） 近来还是那么忙，趁五一更新一下程序吧。这个版本主要增加和改进了以下东西：1，对字符串改用localeCompare来比较；2，一次排序中能使用多个排序对象（用于值相等时再排序）；3，修正一些发现的问题；4，改进程序结构，个人觉得是更灵活更方便了；5，增加bool类型比较；6，添加attribute/property的内容；7，修正ie6/7的radio/checkbox状... 阅读全文

摘要： 上一阵子做过一个图片切割效果，得到很多人关注。其中有很多人向我询问如何做一个真正的图片切割（裁剪），这里需要声明一下：首先js是不能操作客户端文件的（除非特殊情况），所以图片的切割必须在后台处理，对于客户端的图片可以先上传再切割或者把图片和切割参数一起传递到服务器再处理（上传文件不在本次讨论范围，请自行修改）；还有是通过客户端传递的参数来处理图片，确实能得到展示图或预览图的效果（这是针对有些提出在... 阅读全文

摘要： 相关推荐：AlertBox 弹出层（信息提示框）效果 近来要做一个LightBox的效果（也有的叫Windows关机效果），不过不用那么复杂，能显示一个内容框就行了。这个效果很久以前就做过，无非就是一个覆盖全屏的层，加一个内容显示的层。不过showbo教了我position:fixed这个新特性，决定重写一遍。先看效果：LightBox 内容显示 ps：“定位效果”的意思是... 阅读全文

摘要： 程序集合了宽度、高度、透明度、top、left的渐变，可以自定义渐变项目和各个项目的初始值结束值，还能以任意点（定点）为中心渐变。使用该程序能实现很多常见的动画特效，包括大小变换、位置变换、渐显渐隐等等。效果： 程序说明： 渐变效果的原理就是利用定时器不断设置值，如果要减速效果就设置一个步长（详细看JavaScript 弹簧效果） 。这里只是把能渐变的属性（透明度、宽、高、left、top）整合在... 阅读全文

摘要： 近来要做一个记事本系统，想找一个合适的日历控件，但网上的都是那种日历选择控件。于是到qq的记事本系统找了一个，但里面的算法有点落后，所以用了它的样式自己写了个。效果：<<>>年 月 日一二三四五六 程序说明【Date】这个日历控件运用了很多Date相关操作和方法。先说说Date对象几个有用的属性：getFullYear：返回年份值getMonth：返回月份值getDate：... 阅读全文

摘要： 由于asp的cookie是经过url编码的，所以读之前要unescape一下。下面是我用正则的方法取cookie，包括单值和多值：[代码]有不完善的话，欢迎指出。 阅读全文

摘要： ie7的li:hover问题[代码]ie6和ff都很正常但ie7就有问题，当把光标放在文本框中，然后再把鼠标放在菜单上，弹出来的菜单就不会消失了解决方法是去掉#list:hover或者加一个样式在onmouseout中设置但未知什么原因ie6的line-height失效问题[代码]ie7和ff显示正常 但ie6的line-height就没效果未知解决方法，未知原因ie高度设置问题[代码]这是一个全... 阅读全文

摘要： 序一（08/07/21）很久之前就在一个网站的截取相片的功能中看到这个效果，也叫图片裁剪、图片剪切（设置一下也可以做出放大镜等类似的效果）。当时觉得很神奇，碍于水平有限，没做出来。前些日子突然想做一个透镜效果，就突然想到了这个效果，于是找出当年“珍藏”的代码决定一尝所愿。序二（08/12/06）自上一个版本的图片切割效果出来后，虽然也经常看到“框架开发这个如何如... 阅读全文

摘要： 序一（08/07/06）看到alibaba的一个图片切换效果，感觉不错，想拿来用用。但代码一大堆的，看着昏，还是自己来吧。由于有了做图片滑动展示效果的经验，做这个就容易得多了。序二（09/03/19）自写了Tween缓动之后就很想重新写过这个效果，近来有点时间，终于可以动手了。除了改成Tween缓动，也改进了程序算法，不过原理还是一样的。效果预览 仿淘宝/alibaba图片切换： 程序说明原理就是... 阅读全文

摘要： 请到这里看09-08-18更新版本类似的多级浮动菜单网上也很多实例，但大部分都是只针对一种情况或不够灵活，简单说就是做死了的。所以我就想到做一个能够自定义菜单的，有更多功能的多级浮动菜单。而其中的关键就是怎么根据自定义的菜单结构来生成新菜单，关键中的难点就是怎么得到下级菜单结构和容器对象的使用。理想的做法是每次有下级菜单时，从对象直接取得下级菜单结构，放到容器对象中，并且容器能重用，而不是每次都重... 阅读全文

摘要： 能够根据自定义的菜单数据和select，自动设置联级的下拉菜单，可定义默认值。效果： 其中参数1是菜单结构：[代码]参数2是select的id集合(按顺序)：[代码]可设置默认值(按顺序)：[代码]源码：[代码] 阅读全文

摘要： CodeCode highlighting produced by Actipro CodeHighlighter (freeware)http://www.CodeHighlighter.com/-->'遍历文件夹sub ListFolderContents(path) dim fs, folder, file, item, url set fs = CreateObject("Sc... 阅读全文

摘要： 仿照常见的那个图片变换flash做的效果，纯js。不过滤镜变换只对应ie，ff只能看到一般的切换。这个js做的效果最早在sina看到，这里把这个效果封装好方便使用。效果： 程序说明： 图片未开始转换时，由于没有图片会显示一个红x，所以隐藏图片： [代码] ps：以前我用this._img.src="javascript:void(0);";但这个在ie8会出错。 这个变换效果需要滤镜，所以只支持i... 阅读全文

摘要： 上次做图片滑动展示效果时做了减速效果，就想做一个加速效果。结合起来就想到了下面这个东西，当然只是类似弹簧，而不是真正的弹簧。先看效果： 固定范围反弹： 范围渐变反弹： 自定范围反弹：范围： 程序说明：虽然说的是弹簧效果，但实际上要实现的是定点坐标之间的加速和减速移动。 点到点的移动应该都知道怎么做，这里是通过设置滑动对象的left来实现的。 而减速效果，一般的做法是通过用目标值减当前值除以一个系数... 阅读全文

摘要： 这里说的滑移其实就是减速效果，能根据设定的坐标平面移动。 效果自动滑移: 定点滑移:（鼠标点击） 定线滑移:（鼠标拖动轨迹） 代码： <!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><htmlxmlns... 阅读全文

摘要： 更新版本：SlideView 图片滑动（扩展/收缩）展示效果看到jQuery实例：图片展示效果后，我也想拿来试试，但我不太喜欢用框架，所以自己做了个。其中的难点在于怎么设计各个滑动对象进行想要的滑动。一开始我想的是利用滑动对象的宽度的变化来实现滑动，但实行起来发现这个只能在理想状态下实现，一般实现起来很困难。所以还是参照了实例中的方法，利用left的变化来实现滑动。 效果：1111111 2222... 阅读全文

摘要： 根据无缝滚动和八向滚动修改而来，特点是能同一程序中分别向四个方向移动。对滚动框内的样式设置有些要求。效果：顺德于1993年被批准为广东省综合改革试点。 2006年顺德成为首个GDP超过1000亿的县级行政单位。 2000至2003年顺德均在中国百强县排名中位居榜首。 2005年顺德实现国内生产总值856.11亿元。 代码：<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTM... 阅读全文

摘要： <!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><htmlxmlns="http://www.w3.org/1999/xhtml"><head><metahttp-equiv="... 阅读全文