很久没有更新了，今天再来做一个QQ商城的最新焦点图效果。 焦点图花样繁多，最普通的就是图片加下面一排数字按钮了。这样的在前面已经做过几个，再有的变化就只是样式上的，结构和实现方法没有大的不同，就不浪费各位看客的时间了。以后也尽量会找一些新鲜、不常见的效果来仿。比如今天的QQ商城焦点图，它包含的“上一页”、“下一页”两个功能按钮，在之前是没有做过的，我们一起来看一下。 效果图（查看演示页面） 可以看到，除了“上一页”、“下一页”按钮外，其它均和以前的实例相仿，所以结构还是我们的“焦点图万能结构”，按钮就交给jQuery来完成。 HTML结构 //出镜率很高的简单结构，“焦点图万能结构”有木有 <div id="focus"&g ……
今天在蓝色经典论坛与大家讨论了一下淘宝商城焦点图效果。在上个实例《jQuery淘宝商城多格焦点图效果》中没有能完美地仿出来。问题出在自动播放到最后一张图切换第一张图时，淘宝的效果是继续向右滚动，相比之下上例的效果就比较简单粗暴了。所以今天看到蓝色的“tangbao510”童鞋在求教这个问题就参与了讨论，然后终于想通了怎么来实现。 效果图（查看演示页面） 基于上例的代码做出的小改进，所以本例只说明一下有变化的部分，演示页面中有全部的代码注释。 第五张切换至第一张依然向右滚动的情况只出现在自动播放的情况下，所以需要调整的就是setInterval()中的函数。先对索引值进行判断，如果已播放到最后一张：{……}，其它情况：{……} ……
淘宝商城首页的多格焦点图已经存在很久了，个人感觉大图的展示效果很好，最初见到的时候眼前一亮：款式新颖、不落俗套。今天就仿了淘宝商城这个我称之为“多格焦点图”的效果跟大家分享一下。 由于水平有限，仿的不是很到位。至少现在看来淘宝商城的效果在自动播放到最后一个切第一个时是向右走的，而咱们这个山寨版就还是向左经过所有的中间元素回到起点，从我们上一例的《jquery入门实例：从选项卡到焦点图》变化而来，故此也很简单，更容易掌握。等仿得到位了会再和大家分享。 效果图（查看演示页面） html结构 本例中在id为”focus”的div元素下嵌套ul，其中的每个li子元素显示一屏的内容。li中是各div子元素，以style属性的方式定义了各 ……
前些日子从网上学到一个“jquery文字变色”效果，鼠标经过文字变为随机颜色，感觉很有意思。经过学习终于掌握了这种方法，稍稍做了些改进希望能有更多的用途。今天就和大家分享一下这个特效，由于没找到类似的效果也不知道叫什么合适，我就暂把它叫做“jQuery纯文本霓虹闪烁”或“jQuery纯文本广告字”效果吧。 效果图（查看演示页面） 原理 将一段文字例如“abc”分拆为“a”、“b”、“c”三个字符，为每个字符添加单独的标签如“span”； 根据“abc”的字符数进行for循环，通过各“span”标签为各字符定义CSS样式来显示不同的颜色； 定期为文字更换颜色，实现正向、反向的广告牌效果。 html结构 由于操作对象是文字，所以简单到不能再简单 ……
在看着新手教程制作了自己的wordpress主题之后，一直对主题的进一步制作跃跃欲试。可是苦于不懂php，能实现的想法相当有限。在最近接触了jQuery一段时间之后，受启发于记忆中当年百度贴吧弱弱的回复功能，试着做了一个用jQuery实现的。效果见本页面底部的“发表评论”处。 经过摸索与尝试，现在终于可以拿出来见人了。功能是间接地实现了，当然还是有很多的不足，毕竟只是前台页面的一些小动作，效果当然无法与真正的回复嵌套相媲美了。反过来说它只用了jQuery而不需要更改后台程序，操作简单也不影响后期的程序升级；所谓的评论回复只是在文本中体现，避免了真正的回复嵌套必需要求主题支持的麻烦。 这只是一个jQuery效果，当然不只局限于wor ……
虽然前面做的焦点图看起来像是那么回事，但是只能通过鼠标单击切换、图片轮换时太生硬，没有过渡效果……这么烂怎么拿得出手！！ 我们现在就来谈一谈焦点图的进化。在上例的基础上，如何改变能让焦点图有更好的展示效果。 在原理上，现在的jQuery焦点图/图片轮播、幻灯片或者相册效果都有类似之处，但是又都不尽相同。篇幅有限，无法在一篇文章里对所有的效果一一解析。所以做成“jQuery焦点图特效合辑”的形式，不过每一例效果还是可以在源文件中查看到完整的jQuery代码和注释，并且此合辑也会坚持更新，请保持关注哦！ 没有最好、只有最合适的效果！ 所有焦点图效果已在各常用浏览器测试通过，演示页面提供源码下载，代码注释请查看各自的演 ……