Widget
文章平均质量分 63
魔豆爸
擅长Web开发前端技术,具有多种浏览器下开发经验。精通 JavaScriptAJAX编程熟练使用主流JS库。手写JS能力强,运用无干扰的JS思想进行开发。熟练使用CSS及DHTML,W3C标准的推广和贯彻者。熟悉Java语言,MVC设计模式,StrutsSpring架构
展开
-
Javascript自由拖拽类
基本拖拽 new Dragdrop({ target 拖拽元素 HTMLElemnt 必选 bridge 指定鼠标按下哪个元素时开始拖拽,实现模态对话框时用到 dragable 是否可拖拽 (true)默认 dragX true/false false水平方向不可拖拽 (true)默认 ...2010-09-13 17:45:25 · 116 阅读 · 0 评论 -
Raphael实现商品来源去向图
数据可视化 是很多大数据分析的一项重要工作,甚至有专门的团队做这项工作。Web上的各种图形(饼状图,柱状图等)一直被flash所垄断,随着HTML5的发展,SVG和Canvas也逐渐走上舞台。这不,产品要求跨平台,这次不能使用flash。考虑到第一次接触,开发周期较短,评估后决定使用Raphael.js。 Raphael,意为拉斐尔(姓氏),另外拉斐尔也是意大利画家、建筑学家。Rapha...2014-09-17 18:11:49 · 305 阅读 · 0 评论 -
瀑布流的简单实现
基本流程第一屏图片不用Ajax加载,默认写在页面上。第一屏要以最快效率打开,待JS文件下载后再Ajax请求明显要慢。滚动到最后一行图片时开始加载图片,每次加载两行,每行4张图片(4列布局)。位置计算是关键的,可以以页面中翻页容器或页面footer为参考点,如果scrollTop大概等于翻页容器或footer的top则开始加载。这里的大概根据需求适当缩减100-300px。加载规则...2013-05-29 06:53:50 · 93 阅读 · 0 评论 -
将光标定位于输入框最右侧的实现方式
前端开发过程中,经常需要这样的场景。用JS实现将光标定位于输入框最右侧。 场景一:编辑图片的描述文字 场景二:Script.aculo.us的Ajax.InPlaceEditor类。 双击可编辑,编辑后离开可自动更新该区域。 以上场景都需要JS实现将光标定位于输入框最右侧,却不是通过鼠标点入输入框内。我们知道实现最基本的方法是HTMLElement的f...原创 2012-04-16 23:10:24 · 924 阅读 · 0 评论 -
图片播放(1)
一道题目,要求:在页面的固定区域内实现图片的展示 1)每点击一次右箭头,图片区域向左滚动出一张图片,反之相同;2)当发现图片滚动到末尾时,响应的箭头变成不可点击状态;3)鼠标在图片区域内滑动滚轮,图片会随着鼠标滚轮的方向进行响应的滚动;4)当超过5秒没有任何交互操作时,进入自动滚动状态,间隔为5秒,到末尾时自动回到起始状态;5)要求使用jQue...2012-02-13 09:49:28 · 114 阅读 · 0 评论 -
JavaScript模态对话框类(拖拽时动画)
2010年写了一个模态对话框类,这次进行一些重构和扩充。拖拽时使其有动画效果。接口没变,如下 new ModelDialog({ caption 标题 '对话框标题'(默认) template 主体内容 ''(默认) dialogCls 对话框className 'md-dialog'(默认) ...2012-01-15 19:33:03 · 90 阅读 · 0 评论 -
Javascript自动补全类(2)
第一篇中的补全内容不会随着输入的自行筛选。即补全的内容是固定不变的。这篇的则会随着用户输入而自动匹配。 接口: new InputSuggest({ input HTMLInputElement 必选 data Array ['sina.cn','sina.com','2008.sina.com','vip.sina...2012-01-13 13:11:36 · 103 阅读 · 0 评论 -
JavaScript模态对话框类
模态对话框类/** * JavaScript DodelDialog v0.1 * * * new DodelDialog({ * caption 标题 '对话框标题'(默认) * template 主体内容 ''(默认) * dialogCls 对话框className 'md-dialo...2010-12-06 09:02:53 · 82 阅读 · 0 评论 -
Javascript自动补全类(1)
/** * new InputSuggest({ * input HTMLInputElement 必选 * data Array ['sina.cn','sina.com','2008.sina.com','vip.sina.com.cn'] 必选 * containerCls 容器classNam...2010-10-20 08:35:31 · 141 阅读 · 0 评论 -
利用keydown事件阻止用户输入
先了解下各事件的区别keydown:在控件有焦点的情况下按下键时发生keypress:在控件有焦点的情况下按下键时发生keyup: 在控件有焦点的情况下释放键时发生意义keypress主要用来接收字母、数字等ANSI字符。keydown 和 keyup 事件过程通常可以捕获键盘除了PrScrn所有按键 (这里不讨论特殊键盘的特殊键)keypress 只能捕获单个...2015-07-09 14:36:02 · 1178 阅读 · 0 评论