摘要: 平时玩着新浪微博时,会发现右下角的“返回顶部”按钮挺好用的,实现这样的功能非常简单,今天趁着有空,也模仿着做了一个demo,效果见页面右下角。由于原理相当简单,也没必要详细说明,主要是当滚动条拉下时,出现“返回顶部”按钮,点击就会迅速把页面往上滚。其中最难搞的却是样式的设置,由于ie6以下版本不支持position:fixed,必须通过ie才支持的CSS expression进行绝对定位来模仿固定定位。跨浏览器的固定定位样式,其中”_”符号只有 IE6 才能识别:1position:fixed;2bottom:50px;3right:10px;4_position:absolute;5_bot 阅读全文
posted @ 2011-05-10 00:44 大G 阅读(498) 评论(0) 推荐(1) 编辑
摘要: 功能介绍: 通过鼠标点击页码或指示,实现页码的跳转。 功能由一个page()函数实现,函数内部含有5个功能函数,分别实现不同的功能。 appendSpan(val)实现创建并添加span节点,主要通过该功能函数实现指示的生成; insertSpan(val)实现创建并插入span节点... 阅读全文
posted @ 2011-05-08 11:21 大G 阅读(499) 评论(1) 推荐(0) 编辑
摘要: 功能介绍:当鼠标点击某张图片,所有图片以相同速度向某定位点进行移动,最后使点击图片完全展露,实现图片展开效果。效果预览:创建构造函数,并在里面调用初始化函数,传入参数稍后介绍;初始化方法init()接受4个参数,分别为:id:包含图片容器id,size:包含图片容器大小,showSize:展开图片大小,speed:折叠/展开速度,默认值为10... 阅读全文
posted @ 2011-05-05 21:27 大G 阅读(805) 评论(0) 推荐(0) 编辑
摘要: 重新温故Math.sin()与Math.cos()方法,想找个例子实践一下,当然想到的是圆周运动。通过设置长边与短边,就能实现椭圆运动了。废话不多说,马上入正题。 首先写html代码,设置容器并附id“container”,然后加上若干图片。加上适当的样式。最为重要的是将#container设置为相对定位,这样才能使图片的绝对定位以容器为参考对象。 阅读全文
posted @ 2011-04-20 20:35 大G 阅读(6200) 评论(2) 推荐(0) 编辑
摘要: 众所周知,绝对定位absolute是选取其最近的父级定位元素作为参考对象的。假如没有这样的父级元素,将以body作为参考对象。带着这样的假设,写下以下代码:<div>这是父级容器<span style="position:absolute;top:0;left:0">绝对定位例子</span></div> 结果大出所料,绝对定位元素并没有以body作为参考对象进行定位,而是保持其原有位置不变。而当我们进一步指定left与top值时,发现表现终于像我们之前假设一样。<div>这是父级容器<span style= 阅读全文
posted @ 2011-04-20 16:26 大G 阅读(280) 评论(0) 推荐(0) 编辑