标签: 滑动

功能描述:鼠标移到上/下箭头,页面慢慢向上/下滑动,鼠标移开则停止;若点击则直接滑到页首/页尾。

核心源码来自http://kan.willin.org/?p=1333

不晓得有多少同学在用这个滑动导航的jQuery代码,在用的不妨再看看咯~

html代码+php判断,文章页才加载comt这个div: 继续阅读

花了一下午把Simple-I主题再一次全面的整理了一遍,对所有JS进行了优化,主要是在对象选择的优化上。

其中一段就是这个滑动导航代码的小更新,原来的代码是:

 
<div id="shangxia"><div id="shang"></div><div id="comt"></div><div id="xia"></div></div>

继续阅读

Wuha,实习上课任务已完成,剩下一些文字总结!昨收到指导老师指示,今明两天她自己上课,让我们自己好好专研教材。这不我就待家里,在梦中专研到今12点,多努力的孩子呀!

这次还是再次折腾jQuery,实现“双击页面返回顶部”,最基本的核心代码:

 
$('html,body').dblclick(function(){
 
	$('html,body').animate({scrollTop: 0},800);
 
});

用上这段代码后即可实现:双击页面任何地方,网页即会800ms返回顶部。不懂jQuery的,可先阅读《如何正确使用jQuery代码》

继续阅读

前几天到的《CSS那些事儿》看得无味一点不好玩,还是折腾jQuery了!

nav.jpg

不妨注意左侧的滑动导航栏,然后试着滑动下浏览器的滚动条?

继续阅读

上篇文章说道给小站加个返回顶部的按钮,很简单很实用很友好。一句html插入代码、一句CSS美化代码、一句jQuery滑动代码,轻松搞定!这篇文章接着来说,相关代码上篇文章也已补充,今儿就主要来说说代码的含义。

既然用了,顺便了解学习下它的含义,那是不学白不学的事儿呀!先看效果图,最好是亲自点击体验:

huadong.jpg

图中左手边三个图标,功能分别是滑动到顶部、到评论、到底部。具体代码:

继续阅读

东西很简单,还是利用jQuery,直接代码:

html代码,一般放在footer.php里:

 
<a href="#" id="top"> 返 回 顶 部 </a>

CSS代码,使用了fixed让对象固定于浏览器窗口:

 
#top{position:fixed;bottom:0;right:10px;}

jQuery代码,注意正常使用的几个条件:

 
$('#top').click(function(){$('html,body').animate({scrollTop: '0px'}, 800);return false;});

OK,此文完! 继续阅读