jquery


Airen的头像

手机上网站导航的制作

为了让Web页面在手机上显示流畅,现在国外很多网站都使用Responsive设计和CSS3 Media Queries的结合来实现。这样的实例到处可见,那么今天我想和大家一起学习的是有关于这种方法实现手机布局中的导航制作。

如果你的导航选项比较多,放到手机上来浏览就会挤到一起,造成美观性的不足。下面为了解决这样的问题,我们就一起跟随Nick La写的教程《Mobile Navigation Design & Tutorial》学习如何使用jQuery来解决刚才所说的问题。

小小赞助大大帮助

如果您觉得本文的内容对您的学习有所帮助:

支付鼓励


Airen的头像

jQuery Timeline

TimelineVeriteCo写的一个jQuery插件。它将一连串的事件集合到一起,按时间轴的顺序展示这些发生的事件。你可以将各种媒体、图片、视频、地图等相关信息插入到timeline。结合设计可以完美的展示你的工作效率或者更强的信息。比如说你一年,或者多年下来人生中的大事等。

小小赞助大大帮助

如果您觉得本文的内容对您的学习有所帮助:

支付鼓励

 
Airen的头像

jQuery制作Web全屏效果

记得有一次群里在讨论,有没有办法让页面做成全屏效果,就如在Firefox浏览器上按“全屏”选项,让整个页面满屏显示。当时感觉有点不可思议,可是今天在Tutorialzine.com看到一份教程《Enhance Your Website with the FullScreen API》,可以轻松实现全屏效果。

具体详细的介绍,可以查看Full Screen API,我在此处只介绍一下如何使用jQuery实现全屏效果的过程。

小小赞助大大帮助

如果您觉得本文的内容对您的学习有所帮助:

支付鼓励


Airen的头像

jQuery和CSS3制作回到页面顶部和底部

当一个页面的篇幅太长时,用户的检验就有点烦,特别是当用户要到页面的底部或顶部时,只靠scrollBar来操作的确不爽,我有时也烦。当然,W3cplus也有这样的不足之处,好多朋友都有提过,于是在第二版本中我加了一个回到顶部的效果,但不知道怎么加回到底的效果。因为自己的jQuery还处在学习的初级阶段,属于半吊子中的半吊子,时常依赖别人的插件来做效果。比如说,前面介绍的《jQuery制作go to top按钮》中介绍的回到页面顶部的四个demo效果,都是到处整来的,有时只知道其表,不知道其质。真是感到惭愧呀。

小小赞助大大帮助

如果您觉得本文的内容对您的学习有所帮助:

支付鼓励


Airen的头像

jQuery和CSS3制作Popup弹出窗

Popup弹出窗,时常有碰到,以前都只是写Popup的样式,从没有涉及jQuery怎么实现。今天看到一个教程有关于这方面的制作,认真学习了一下。事后仔细一想,用jQuery来制作还是可以看懂的,现将代码稍加整理放上站上,以备今后可以使用,因为记性不好,所以这个懒就偷不了。别的不说,和我一样不懂的,就一起动手试试吧:

小小赞助大大帮助

如果您觉得本文的内容对您的学习有所帮助:

支付鼓励


Airen的头像

jQuery制作Tabs

Tabs的效果在Web页面制作中,可以说是随处可见,我也知道有关于这样的教程在网上上相当的多,前面本站在《纯CSS3制作Tabs选项卡》中介绍了纯CSS制作的Tabs,而《CSS3+jQuery制作切角的Tabs》介绍了使用CSS3+jQuery制作Tabs的方法。今天依然要介绍的是使用jQuery来制作Tabs,但这种方法相对来说是简单易于理解的,就算我这样的初学者都能理解。

小小赞助大大帮助

如果您觉得本文的内容对您的学习有所帮助:

支付鼓励

 
Airen的头像

jQuery制作水平手风琴

上回在《如何使用jQuery制作手风琴效果》一文中介绍了使用jQuery制作垂直手风琴效果,今天我们一起在来看一个水平手风琴效果,如下图所示:

在这个例子中,我创建了一个水平手风琴效果,用来展开每个缩略图的提示内容。下面我们来看其具体是如何通过jQuery来实现。

小小赞助大大帮助

如果您觉得本文的内容对您的学习有所帮助:

支付鼓励


Airen的头像

使用jQuery和CSS控制元素对齐

上节在《自定义表单——jQuery制作个性化Checkbox》介绍了用jQuery美化表单中的checkbox。今天和大家一起探讨另一个表单制作中的对齐问题,这个我想大家在平时制作表单之时,关于对齐一定有碰到过,那么在这个简短的教程中主要尝试另一种解决方法,希望大家会喜欢。

在Web页面中创建一个Web表单时(比如说注册信息表单,或者联系表单),你都必须做出一个功能和视觉对齐的布局。如下图所示:

小小赞助大大帮助

如果您觉得本文的内容对您的学习有所帮助:

支付鼓励

页面