为博客添加slideshow幻灯片效果

By
WP札记

最近一段时间看了许多外国比较出色的博客,除了广告多、流量大、评论少之外,几乎很大一部分都在首页放上了一个幻灯片展示-slideshow。或绚丽或低调,主要目的无疑都是突出显示博客与众不同之处,吸引读者眼球。看了很多实现方法,基本都是插件类型实现的,我不喜欢用插件,感觉比较难搞,而且定义起来麻烦。下面找了介绍两种非插件的实现的方法。

1、A Simple jQuery Slideshow

JquerySlideshow.jpg

演示:demo 下载:Download

之前用过这个方法,主要通过z-index层的替换和opacity透明度的改变来实现渐变的幻灯片切换,缺点是需要加载的Jquery库比较大。

2、TinySlider

tinyslider.jpg

演示:demo. 下载:Download

这是目前在用的方法。独立的script只有1.5k大小,并且不用加载其他东西,很小巧。脚本支持自动旋转和选项自动恢复,可以适用于导航列表的方向切换(垂直或水平)。

下面拿我目前用的做个例子。

css部分

php部分

当然,最后别忘了在header添加(假设下载的packed.js文件,位置在主题的js文件夹内)

有了以上几步,实现slideshow并不难,有需要就动手试试吧。

0

Comments: 86

  1. 怕影响速度,放弃幻灯片

    2010年07月23日
    • @MK 这个……各有所好吧

      2010年07月24日
  2. 图片没放在主机,这个米用~

    2010年07月24日
  3. 博主的主题感觉很舒服哈,我喜欢的风格 :wink:

    2010年07月24日
  4. 广告多、流量大、评论少 :eek: 这个评价太贴切了 :twisted:

    2010年07月25日
  5. 这个很不错的 学习下 :sad:

    2010年07月27日
  6. 国外的广告一般都整齐的放在右边,而且处理的很漂亮,认人有点的欲望

    2010年07月28日
  7. 一直担心对速度有影响,就没有尝试。

    2010年07月29日
  8. 这个插件怎么指定显示的文章,看评论好像是只能一次只能指定一个分类下 的文章?

    2010年08月09日
    • @aisinvon 显示分类文章是我自己定义的,具体显示什么可以根据自己的情况去搞哇~~

      2010年08月09日
  9. 看看我博客的分类幻灯片,我是从一个插件上抠下来的 :lol:

    2010年08月12日

发表评论

电子邮件地址不会被公开。 必填项已用*标注

*

:razz: