标签:jQuery 实例

盒子(Box)中间的链接(Links),基于MooTools or jQuery »

盒子中间的链接,这个标题不知道如何取比较合适,说白了就是给一个Box模块中间加一个有遮罩效果和悬停效果的超链接,当我们的鼠标移到盒子上面有一个醒目的链接按钮,反之,链接按钮消失并移除。接下来,我们看一下效果图吧,比较直观一些。 ViewDemos» 我们的目标我们这里有一些包含内容的盒子。这个目标就是:当我们的鼠标...

继续阅读 →

打破重复的动画效果,基于CSS,MooTools or jQuery »

也许您看到此文章的标题,有点怪,不好理解。其实我想表达的应用场景是网页上的视频,图片和在线的文档阅读器等,在初始状态下是一种默认效果,当我们的鼠标移到目标上时是还是没有变化的,还是默认的效果。面对这样重复的默认动画效果。是否我们能改善一下用户的体验,增加一个不一样的动画效果或提示。说是那么多,还是有点不明白!哈哈,那我们还是先看一下实...

继续阅读 →

关于‘TOP’置顶链接的那些事儿 »

‘TOP’置顶链接,说的通俗一点就是‘返回顶部的链接’,‘gototop’一般都放在页面的底部,它可以快速返回页面顶部,以节省用户浏览页面的时间。它主要的应用场景是当你有一个很长的网页内容时,您通常要把‘TOP’锚点链接添加在页面底部,只要用户一点击‘TOP’链接,就可以马上回到页面的顶部了。我们遇到的问题是:不是滚动到页面底部的时候...

继续阅读 →

删除残破的图片(Broken Images),基于 MooTools or jQuery »

我们写BLOG的时候,喜欢收藏一些好的文章,但是我们收藏的文章中的图片路径大多数是原来的路径,并没有保存到自己的目录中,这样会有图片断链的问题,图片元素就会空白站位,会影响网页的美观性,会给用户带来失落感,不信任感。想了一会儿,我决定最好一起删除的网页中破碎的形象。下面你会发现使用MooTools或jQuery做此事是多么容易的一件事...

继续阅读 →

10个jQuery过渡效果:移动的元素与样式 »

围剿Flash的不仅有HTML5,还有JavaScript,著名的JavaScript框架jQuery在运动特效方面已经越来越流畅,有时候你需要点一下右键来确认它不是Flash。本文介绍了10个非常出色的jQuery运动特效,这些效果可以更有效地展示你的内容。1.流感导航菜单下面的导航菜单,当鼠标在上面移动的时候,会很流畅地垂下解释菜...

继续阅读 →

网页随机换肤 »

我在上一篇《网页换肤,基于MooToolsorjQuery》文章中,通过一个完整的实例讲解了一下网页换肤的原理。即,通过调用不同的样式表文件来实现不同的皮肤切换,并且需要将换好的皮肤记入Cookie中,这样用户下次访问时,就可以显示用户自定义的皮肤了。在CSS9.NET博客上,IIduce写了一篇关于随机加载样式的文章,他给自己的微博...

继续阅读 →

网页换肤,基于MooTools or jQuery »

我们都知道WEB2.0是以人为核心线索的网,为了更好的增强用户体验,一些比较流行的SNS社会网络,非常重视用户自定义功能,例如自定义新闻内容,可以任意拖动新闻内容,还可以选择网页皮肤,例如:谷歌,雅虎,腾讯等都类似的功能。网页换肤的原理是通过调用不同的样式表文件来实现不同的皮肤切换,并且需要将换好的皮肤记入Cookie中,这样用户下次...

继续阅读 →

Google-Style之元素褪色(Element Fading),基于MooTools or jQuery »

如图所示:Google-Style——元素褪色(ElementFading)谷歌最近在他们的网页上推出了一个有趣的效果:左上角和右上角的导航条不显示了,直到您移动鼠标或离开searchtermbox。为什么?我猜测,他们是希望自己的网页,尽可能的简单;这样的好处就是搜索框立即给予关注,至少有一半的用户可能只需输入关键字,按下回车键——...

继续阅读 →

表单设计与滑动的标签(Labels),基于MooTools or jQuery »

对于表单的可用性设计,一直是Web设计人员研究的课题,如果你想了解更多关于FormDesign的知识,我建议你看一下Yahoo的LukeWroblewski写的书《WebFormDesign》,人家是这方面的大牛,有许多的专题论文。我们的设计灵感来自Apple重新设计的商品结帐表单。我们实现的效果就是:input的labels水平滑动...

继续阅读 →

在网站外部链接旁边添加Favorite Icons的方法,基于MooTools or jQuery »

最近,我碰见了一个如何检索页面上所有的外部链接的jQuery文章,很有意思。对于我来说,我很喜欢收藏一些很酷的网站,并且分类罗列出来,以方便以后使用,如果在链接地址的旁边配有这些网站的favoriteicon,那就更美了。FromLiviuHolhoş实现了此功能,我选择了不同的方法,使用CSS的background-image属性,...

继续阅读 →