15 款基于 jQuery 的 RSS 阅读器插件

想要第一时间获得网站和博客的更新?RSS一直是最佳的选择。RSS提供的更新内容包括博客文章、新闻标题、标准格式的音频或视频等。

本文介绍了15款实用的基于jQuery的RSS阅读器插件,有了它们的帮助,你可以轻松在网站中显示其他网站或博客的最近更新。

1. jQuery RSS ATOM Feed Button

这款阅读器的功能十分完善。

源码/演示

2. jQuery REST RSS

该插件与最初的jQuery RSS 十分类似,不过它演示了如何在列表中通过悬停鼠标来预览内容,提示框由隐藏的div构成,在鼠标滑过的时候出现。

源码+演示

3. FeedEk

FeedEk基于jQuery开发,是一款具有综合功能的阅读器。它可以帮助你轻松的获得任何的信息订阅。

源码/演示

4. zRSSFeed

此插件使用Google Feeds API,它可以获得所有网址的RSS订阅。它使用内嵌的CSS样式类将文件转为结构化的HTML形式输出。

源码/演示

5. PaRSS

这款插件可以按照自定义格式展现RSS信息。它使用样式表中的UL或OL来展示网页上的内容。

源码+演示

6. jFeed

jQuery RSS/ATOM 订阅解析插件。

源码+演示

7. jQuery News Ticker

此插件借鉴了BBC News ticker的部分思想,但是它更轻量,更好用。

源码+演示

8. RSS Feed Rotator

此插件包含了获取订阅的服务端脚本、jQuery的AJAX方法和一个分隔信息的Javascript计时器。在获取订阅的过程中界面不显示信息,当获取完成后插件会将信息逐个显示。

源码/演示

9. jQuery Google Feed Plugin

Google Feed Plugin提供了服务器组件来帮助整合RSS阅读器。只要客户端包括最新的Google API脚本,开发者就可以在客户端整合RSS订阅功能。

源码+演示

10. 运用jQuery获取RSS信息

此插件可以运用jQuery帮助你快速、方便的获取要在网站上显示的RSS信息。它可以应用于任何网站,而且操作十分简单。

源码/演示

11. 运用jQuery和jGFeed创建RSS阅读器 

教你如何运用jQuery和jGFeed插件远程获取最新的RSS订阅,并且将结果加入到现有的标记中。jGFeed可以获得任何主机上的RSS信息,并且返回一个方便使用的JSON对象。

源码+演示

12. 运用PHP 和jQuery 创建RSS阅读器应用

教你如何使用PHP和jQuery建立简单的RSS阅读器应用。此插件运用PHP来处理服务器请求,用jQuery来提高应用的性能和响应速度。

源码/演示

13. Discover jQuery rssFeed

此插件使用简单,用来展现用户订制的RSS内容。

源码+演示

14. jQuery and PHP RSS Feed Syndicator

此插件可以高效、快速的为用户订阅的RSS内容进行更新。

源码/演示

15. jQuery RSS Slider

此插件运用jFeed和jQuery Flips设计了滚动的阅读页面,可以滑动显示最新的前三条讯息。

源码/演示

英文原文:15 Best of jQuery RSS Feed Readers

7 个简单实用的 jQuery 图片播放器

在网页特效中,我们经常会遇到需要循环播放图片的情况,比如首页上的广告轮播或者相册浏览等。如何简单的实现一款漂亮平滑的图片播放插件呢?下面就介绍几款非常不错的jQuery图片播放插件,希望对大家有所帮助。

1、jQuery图片播放插件Diapo

这是一款基于jQuery的图片播放插件,提供缩略图效果和多种图片切换动画效果,并且支持任何HTML元素的播放切换,一起来看看效果。

2、jQuery滑杆式图片播放器jCoverflip

jCoverflip又是另一种形式的jQuery图片播放器,该图片播放器可以通过拖动下面的拖动条来切换滑动图片,非常简单实用,一起来看看演示效果。

3、jQuery带缩略图的图片播放插件SlideShow

这是一款基于jQuery的图片播放插件,该图片播放插件带有缩略图,用户可以点击缩略图来切换图片,使用非常方便,下面一起来看看这个jQuery带缩略图的图片播放插件。

4、jQuery图片播放插件Nivo Slider

Nivo Slider是一款基于jQuery的图片播放插件,Nivo Slider不仅轻巧,配置简单,而且支持多种图片的动画切换效果,支持多主题。jQuery插件版免费,Wordpress插件需要收费,下面一起来看 看这个图片播放插件的演示效果,推荐大家可以关注一下。

5、jQuery图片播放插件FlexSlider

FlexSlider是一款基于jQuery的图片播放插件,FlexSlider配置比较灵活,FlexSlider能让你轻松的创建内容滚动的 效果,具有非常高的可定制性。FlexSlider是将UL列表转换成内容滚动的列表,可以自动播放,或者使用导航按钮和键盘来控制。

6、jQuery图片水平滚动插件

这是一款基于jQuery的图片水平滚动插件,这个插件在滚动图片的时候十分流畅,同时支持自动播放,你也可以利用鼠标滚轮来使图片左右滚动。

7、jQuery仿苹果图片播放器

这是一款基于jQuery的仿苹果样式的图片播放器,这个图片播放器配置简单,外观简洁但不是美观,和苹果的特点非常相符。这个图片播放器非常适合放在你的首页上作为产品图片轮播组件。

以上就是几款不错的jQuery图片播放插件,希望大家会喜欢

转载请注明出处:html5_dev的专栏

图形化 Closure Compiler,JS 压缩工具

Google 为网站的开发人员提供了一些列对网站进行优化的工具。

Closure Compiler 就是其中之一,这个工具可以用来对 js 文件进行压缩,加快客户端加载的速度。

日前有网友用 Java 开发了一个图形化的 Closure Compiler 工具,如下图所示:

该工具需要 Java 7 支持,下载地址:ClosureCompilerGUI

另外 osctools 也提供了一款在线的 JS/CSS 压缩工具

Windows 下的 Nodejs

为什么搞这个?

  1. 公司电脑的权限管理比较严,不能安装软件,不能常驻系统进程等,所以像 xampp 之类的都不能正常执行
  2. 我又想在空闲的时候做点东西
  3. 所以坑爹的我只能自己研究在windows下运行nodejs了

怎么执行?

  1. 下载并解压到一个目录
  2. 进入目录双击 Start.bat 执行
  3. 在命令行下执行 node ex_project\jade\app.jse\app.js

你会看到

12
<div class='bogus-wrapper'><notextile><figure class='code'><div><table><tr><td><pre><span class='line-number'>1</span> </pre></td><td class='code'><pre><code class=''><span class='line'>E:\nodejs4win>node ex_project\jade\app.js Express server listening on port 3000 in development mode</span></code></pre></td></tr></table></div></figure></notextile></div>

这样的结果,那么打开浏览器输入:

12
<div class='bogus-wrapper'><notextile><figure class='code'><div><table><tr><td><pre><span class='line-number'>1</span> </pre></td><td class='code'><pre><code class=''><span class='line'>E:\nodejs4win>node ex_project\jade\app.js Express server listening on port 3000 in development mode</span></code></pre></td></tr></table></div></figure></notextile></div>

OK,这样一个 nodejs + express + jade 的项目就跑起来了

所有 windows 都可以执行吗?

  1. 在 Windows Xp 下可以直接执行,不需要权限
  2. 在 Windows 7 下本地执行的话不需要 windows 权限,局域网内执行的话,需要开放局域网访问的权限。

都有什么?

  1. nodejs.exe – windows 版 nodejs
  2. npm – nodejs 的模板库管理工具,但windows下很多库都不能直接安装使用
  3. express – mvc framework
    1. jade – template
    2. dot – template
    3. ejs – template
    4. Tenjin – template
    5. jst – template ,有错误,还未修复
  4. dirty – 因为windows 下数据库还不支持,所以只能采用一些其他的工具替换了。这个是目前我找到的最好的工具了。
  5. n2Mvc – 国人开发的一个独立的轻型的mvc架构

怎么用?

  1. 刚接触nodejs的建议先从project 目录下的代码看起,从最简单的hello_world,到n2mvc,可以让你对Nodejs有一个初步的了解
  2. 然后可以在express的模板中选一套主攻吧

这套环境可以用来生产吗?

你开玩笑呢?哥,这个只是让你折腾玩的,想到生产环境还是用Linux吧,虽然我现在是做.net的,但我还是觉得windows不适合做服务器。

这些都是你写的吗?

不是,我只是把他们拼在一起。我会在后面给出他们的项目地址。

有文档可以参考吗?

  1. nodejs官方文档: http://nodejs.org/docs/latest/api/process.html#process.platform
  2. 国内社区的翻译版(未完成):http://cnodejs.org/cman/all.html
  3. nodecn 翻译的文档(未完成):http://www.nodecn.org/all.html
  4. Express JS 中文入门指引手册:http://www.csser.com/tools/express-js/express-guide-reference-zh-CN.html

有问题了问谁?

  1. 可以去cnodejs.org社区提问
  2. 可以去各项目主页发 Issues
  3. 也可以直接在我的项目主页留言等,我会尽量解答

项目【下载】地址

https://github.com/DrayChou/nodejs4win

引用到的项目地址

  1. nodejs : http://nodejs.org/
  2. express : https://github.com/visionmedia/express
  3. dirty : https://github.com/felixge/node-dirty
  4. n2Mvc : https://github.com/QLeelulu/n2Mvc
  5. jade : https://github.com/visionmedia/jade
  6. dot : https://github.com/olado/doT
  7. nTenjin : https://github.com/QLeelulu/nTenjin
  8. ejs : https://github.com/visionmedia/ejs
  9. jst : https://github.com/shaunlee/node-jst

8 款个性化的 jQuery 和 CSS3 菜单

下面要给大家分享8款非常个性化的jQuery和CSS3菜单,这些菜单由于外观比较独特,所以也许不是非常通用,但是我们可以认可的是这些菜单的设计思路非常棒,值得借鉴。下面一起来看看这些菜单吧。

1、超酷的jQuery动画菜单

这是一款效果非常酷的jQuery动画菜单导航,当你把鼠标移到菜单项的时候,将会出现十分平滑的滑动效果,这个菜单漂亮的地方还在于菜单的背景图片,动画本身并不复杂,下面就一起来看看这个简单漂亮的jQuery动画菜单吧。

2、jQuery侧边固定停靠导航

这是一款非常精美的jQuery侧边固定停靠导航菜单,鼠标移入移出是都有流畅的弹入弹出效果,并能固定在浏览器一侧,不随着滚动条下拉而下滑。

3、jQuery和CSS3图片下拉菜单

这是一款基于jQuery和CSS3的图片下拉菜单,当鼠标移到菜单项上时,菜单上就会弹出一张该菜单项的主题图片,并以下拉的方式显示该菜单项的具体说明。下拉过程十分流畅。

4、CSS3 动画导航按钮

这是一组基于CSS3的动画导航按钮,该动画导航会在鼠标移上去之后播放一段对应的小动画,效果十分时尚。不过注意的是,该动画导航只能在基于WebKit的浏览器上才能运行,如Chrome。下面就一起来看看这款CSS3导航。

5、丝带状的CSS导航

这是一款利用纯CSS实现的丝带状的导航菜单,该CSS导航简单而又大方,犹如悬挂在蓝天之上,又仿佛倒映在碧水之中,确实是一个让人看了赏心悦目的CSS导航。

6、CSS3仿Windows 7的开始菜单

这是一款用纯CSS3实现的仿Win 7的开始菜单。如果我们分解这个Windows 7开始菜单,我们会得到1个div,2个ul列表,1组链接以及一些icon小图标,我们可以一起来看看具体的效果。

7、jQuery动画菜单jStackmenu

jStackmenu是一款基于jQuery的堆栈式动画菜单,当你用鼠标点击那个“爱心”按钮时,jStackmenu菜单就会以堆栈方式弹出或者收拢,并呈现出流畅的动画特效。

8、银白色的CSS3导航菜单

这是一款纯CSS3制作的导航菜单,这个银白色的菜单在朦胧夜空的衬托下显得格外亮丽。当鼠标滑过导航时,每个菜单项又会呈现不同的效果,整体上,这款CSS3导航菜单非常简单而又具有立体感。

以上就是8款个性化的jquery和css3菜单导航,喜欢的朋友可以收藏。