随笔分类 -  Widget

微信公众账号开发入门
摘要：此文记录了微信公众号开发的整个流程，想要调用微信 JS API 并非直接引入一个jweixin-1.0.0.js 到页面里那么简单。需要获取 access_token, jsapi_ticken和签名 sign等。其中的任何一个步骤错误都会调用不到其 API。这些参数一般是后台生成，可以用阿里云或新... 阅读全文

posted @ 2015-10-21 07:08 snandy 阅读(23407) 评论(17) 推荐(23) 编辑

PlaceHolder的两种实现方式
摘要：placeholder属性是HTML5中为input添加的。在input上提供一个占位符，文字形式展示输入字段预期值的提示信息（hint），该字段会在输入为空时显示。如目前浏览器的支持情况浏览器IE6/7/8/9IE10+FirefoxChromeSafari是否支持NOYESYESYESYES然而... 阅读全文

posted @ 2014-11-25 08:52 snandy 阅读(56111) 评论(9) 推荐(12) 编辑

JavaScript选项卡/页签/Tab的实现
摘要：选项卡，也称页签，英文用Tab(Module-Tabs)表示。Tab将不同的内容重叠放在一个布局块内，重叠的内容区里每次只有其中一个是可见的。Tab可以在相同的空间里展示更多的信息，它把相似的主题分为一类，用户更好理解。Tab的应用可以缩短页面屏长，降低信息的显示密度，同时又不牺牲信息量。在这种趋势... 阅读全文

posted @ 2014-11-14 10:31 snandy 阅读(68884) 评论(4) 推荐(4) 编辑

JavaScript目录菜单滚动反显组件的实现
摘要：JavaScript目录菜单滚动反显组件，有以下两个特点每个导航菜单项(nav)对应页面一个内容区域(content)滚动页面到特定内容区域(content)时，对应的菜单会自动切换，一般会添加一个高亮样式这个功能可以很方便的提醒用户目前所浏览的位置，有时目录菜单还会设计为滚动时一直固定在指定位置。... 阅读全文

posted @ 2014-10-10 08:15 snandy 阅读(4352) 评论(3) 推荐(8) 编辑

JavaScript吸顶灯的实现
摘要：吸顶灯是各站点常用的一个功能，它有两个特性向下滚动到div位置时，该div一直固定在页面的顶部向上滚动到div原有位置时，div又恢复到文档中的原位置div可能是一个“分类菜单”，也可能是一个“文章导航”。如也有可能是一个购物 “账单信息”实现思路如下div初始居普通文档流中给window添加scr... 阅读全文

posted @ 2014-10-08 14:29 snandy 阅读(8363) 评论(12) 推荐(12) 编辑

Tip和菜单的实现方式
摘要：Tip和菜单有类似的功能，即鼠标光标移上去的时候显示指定元素，鼠标光标离开的时候隐藏该元素。如下示例1：下拉菜单(鼠标移动到“客户服务”上时出现，离开则隐藏)示例2：水平菜单(鼠标移动到“餐饮美食”出现，离开则隐藏)示例3：Tip示例(鼠标移动到“更换”出现，离开则隐藏)从交互角度讲很简单，移上去显... 阅读全文

posted @ 2014-09-16 15:49 snandy 阅读(5425) 评论(0) 推荐(3) 编辑

JavaScript日期组件的实现
摘要：旅游频道的开发中需要定义各种日期组件，有的是基本的日期选择，这个基本日期只包含如下功能左右翻（月）点击天回填到输入域点击“今天”，回填今天的日期到输入域点击“关闭”，日期控件关闭有的同时显示两个月的日期有的包含一些业务信息，比如机票搜索结果页的低价日历。这个比上面的要复杂一些每天的日期格子里含有价格... 阅读全文

posted @ 2014-05-26 07:29 snandy 阅读(12608) 评论(14) 推荐(6) 编辑

利用Keydown事件阻止用户输入
摘要：先了解下各事件的区别 keydown：在控件有焦点的情况下按下键时发生 keypress：在控件有焦点的情况下按下键时发生 keyup： 在控件有焦点的情况下释放键时发生 意义 keypress主要用来接收字母、数字等ANSI字符。keydown 和 keyup 事件过程通常可以捕获键盘除了PrSc 阅读全文

posted @ 2014-02-28 16:32 snandy 阅读(23712) 评论(3) 推荐(2) 编辑

Raphael实现商品来源去向图
摘要：数据可视化 是很多大数据分析的一项重要工作，甚至有专门的团队做这项工作。Web上的各种图形（饼状图，柱状图等）一直被flash所垄断，随着HTML5的发展，SVG和Canvas也逐渐走上舞台。这不，产品要求跨平台，这次不能使用flash。考虑到第一次接触，开发周期较短，评估后决定使用Raphael.js。Raphael，意为拉斐尔（姓氏），另外拉斐尔也是意大利画家、建筑学家。Raphael.js 作者是Dmitry Baranovskiy ，请记住该人，他应该和 John Resig 一样绽放光芒。该库已经被合并至 Sencha，他本人也已加入 Sencha 团队。我做的这个叫做 “商品来源去 阅读全文

posted @ 2013-09-22 07:26 snandy 阅读(2806) 评论(1) 推荐(2) 编辑

瀑布流的简单实现
摘要：基本流程第一屏图片不用Ajax加载，默认写在页面上。第一屏要以最快效率打开，待JS文件下载后再Ajax请求明显要慢。滚动到最后一行图片时开始加载图片，每次加载两行，每行4张图片（4列布局）。位置计算是关键的，可以以页面中翻页容器或页面footer为参考点，如果scrollTop大概等于翻页容器或fo... 阅读全文

posted @ 2012-09-12 11:32 snandy 阅读(1532) 评论(2) 推荐(2) 编辑

图片播放（3）
摘要：功能1，图片数量控制2，自动播放控制（左右来回）3，每次移动图片数量控制4，播放速度控制效果图接口jQuery('.scroll-pic').videoImg({ duration:300, moveCount: 2, autoPlay: true}, arr); slide3.zip 阅读全文

posted @ 2012-03-06 11:57 snandy 阅读(811) 评论(0) 推荐(0) 编辑

图片播放（2）
摘要：效果图jQuery插件方式var imgs = [ { p: 'http://i1.itc.cn/20120209/3ab_28e81ccb_8694_65ad_6eb6_801b4d9d0cdf_5.jpg', l: 'http://mikesakai.blog.sohu.com/203130261.html', t: '博友实拍日本史上最猛烈降雪' }, { p: 'http://i3.itc.cn/20120209/3ab_28e81ccb_8694_65ad_6eb6_801b4d9d0cdf_4.jpg', l:  阅读全文

posted @ 2012-03-06 09:48 snandy 阅读(783) 评论(0) 推荐(1) 编辑

图片播放（1）
摘要：一道题目，要求：在页面的固定区域内实现图片的展示1） 每点击一次右箭头，图片区域向左滚动出一张图片，反之相同；2） 当发现图片滚动到末尾时，响应的箭头变成不可点击状态；3） 鼠标在图片区域内滑动滚轮，图片会随着鼠标滚轮的方向进行响应的滚动；4） 当超过5秒没有任何交互操作时，进入自动滚动状态，间隔为5秒，到末尾时自动回到起始状态；5） 要求使用jQuery-1.6以上版本，遵循web开发规范，js文件以plugin组件方式封装或采用jQueryUI Widget方式封装；6） 可以使用原生JS开发，但要解决浏览器兼容问题，封装方式可参考CommonJS规范；考核点：1. 符合W3C标准2. 实 阅读全文

posted @ 2012-03-05 17:16 snandy 阅读(1569) 评论(0) 推荐(1) 编辑

JavaScript模态对话框类（拖拽时动画）
摘要：2010年写了一个模态对话框类，这次进行一些重构和扩充。拖拽时使其有动画效果。接口没变，如下 new ModelDialog({ caption 标题 '对话框标题'(默认) template 主体内容 ''(默认) dialogCls 对话框className 'md-dialog'(默认) headCls 头部className 'md-head'(默认) btnCloseCls 关闭按钮className 'md-close'(默认) bodyCls ... 阅读全文

posted @ 2012-03-02 20:05 snandy 阅读(2411) 评论(1) 推荐(6) 编辑

Javascript自动补全类(2)
摘要：前一篇中的补全内容不会随着输入的自行筛选。即补全的内容是固定不变的。这篇的则会随着用户输入而自动匹配。接口：new InputSuggest({ input HTMLInputElement 必选 data Array ['sina.cn','sina.com','2008.sina.com','vip.sina.com.cn'] 必选 containerCls 容器className itemCls 容器子项className activeCls 高亮子项className ... 阅读全文

posted @ 2012-03-02 19:47 snandy 阅读(2591) 评论(2) 推荐(6) 编辑

JavaScript模态对话框类
摘要：/*** JavaScript ModelDialog v0.1** new ModelDialog({ * caption 标题 '对话框标题'(默认) * template 主体内容 ''(默认) * dialogCls 对话框className 'md-dialog'(默认) * headCls 头部className 'md-head'(默认) * btnCloseCls 关闭按钮className 'md-close'(默认) * bodyCls 主体className 'md-body' 阅读全文

posted @ 2011-04-15 09:29 snandy 阅读(2453) 评论(15) 推荐(4) 编辑

Javascript自由拖拽类
摘要：基本拖拽 jQuery插件 效果 拖拽状态：x:0, y:0 Drag me. Drag me. 任意方向 水平方向 垂直方向 停止拖拽 开启拖拽 恢复初始状态 dragdrop.zip 阅读全文

posted @ 2011-04-14 08:24 snandy 阅读(6643) 评论(30) 推荐(28) 编辑

Javascript自动补全类(1)
摘要：/** * new InputSuggest({ * input HTMLInputElement 必选 * data Array ['sina.cn','sina.com','2008.sina.com','vip.sina.com.cn'] 必选 * containerCls 容器className * itemCls 容器子项className * activeCls 高亮子项className * width 宽度设置 此项将覆盖containerCls的width * opacity 透明度设置 此项将覆盖contain 阅读全文

posted @ 2011-04-13 09:12 snandy 阅读(2611) 评论(6) 推荐(6) 编辑

JS实现自定义右键菜单
摘要：在灵图时做的，效果如下Demo效果图Demo源码如下 JS实现自定义右键菜单 后退 前进 地图api 实时交通 地图搜索 驾驶导航 灵图UU 路书下载 关于本站 友情链接 右键此区域 阅读全文

posted @ 2011-03-09 08:08 snandy 阅读(47912) 评论(12) 推荐(3) 编辑

< 2025年3月 >
日 一 二 三 四 五 六
23 24 25 26 27 28 1
2 3 4 5 6 7 8
9 10 11 12 13 14 15
16 17 18 19 20 21 22
23 24 25 26 27 28 29
30 31 1 2 3 4 5

统计

点击右上角即可分享
微信分享提示