这个东西最初是在@Xider的博客上看到的，于是我很无节操的扒之，虽然成功了，但是他的背景滚动有别的效果，是我不喜欢的，看了看他的js，晕，完全看不懂，最后无奈还是放弃了，但是天无绝人之路啊，不经意在逛国外网站的时候，也发现了背景滚动，当时甚是激动，于是节操不再，将其完整扒了下来，效果甚是吗满意。

加载jQuery是必须的，一般主题都有加载。

投放js

  1. <script type="text/javascript" charset="utf-8">
  2. var scrollSpeed = 100;  // 速度（毫秒）
  3. var step = 1;  // 每次移动1个像素
  4. var current = 0;  // The current pixel row
  5. var imageWidth = 2247; // 滚动图宽度
  6. var headerWidth = 1280; // 容器宽度
  7. //循环起始
  8. var restartPosition = -(imageWidth - headerWidth);
  9. function scrollBg(){
  10. //Go to next pixel row.
  11. current -= step;
  12. //If at the end of the image, then go to the top.
  13. if (current == restartPosition){current = 0;}
  14. //容器IDClass
  15. $('#header').css("background-position",current+"px 0");}
  16. //重复滚动
  17. var init = setInterval("scrollBg()", scrollSpeed);
  18. </script>

黄颜色的是容器ID，也可以是class，把上面的js放到背景滚动容器附近就差不多了，注释有几句被我翻译的，还有几句超出我的英语范围，我就没动。。

css详解

  1. #header{height:180px;background:#8EC1DA url(bg-clouds.png) repeat-y scroll left top;text-align:center;}

好了，就这样吧，看不懂就跳过吧。。。当我记录。。。

背景层图片 【下载】

下面透露一下福利

GskyPro出售链接已经挂出去半个多月了，一直无人问津，之前我以为可能是价格高了，直到一天，@大发 留言告诉俺，“不是价格高，是因为细节处理的不够”好吧，终于了解其原因了，其实我要技术没技术，都是纯个人折腾的，发叔的一句话算是点透我了，所以我经过一番心力斗争，毅然决定，GskyPro免费放出，至于什么时候放出，大家可以等等吧，明天补课，如果不出意外，周六下午，或者本周日就能放出来啦。、。、

在这里感谢大家的不懈支持，原本挂在顶部的主题出售链接已经去掉了，静候佳音吧~~~

（这里所说的GskyPro非GskyPro2，GskyPro演示地址：http://www.gsky.org/?themedemo=Gsky）

标签: GskyPro, jQuery

已有 48 条评论

  1. 木头怀 木头怀

    :?: :razz: :razz: 呵呵，说不定收藏哈， :lol:

    回复
  2. ghostry ghostry

    好像不错.

    回复
  3. 骑行领域 骑行领域

    可以先免费让大伙儿试用，用的人多了，自然就会暴露很多细节问题，然后你继续优化，慢慢就完善了。接着再出付费主题，这样或许会好很多。对于代码啥的向来无力折腾，玩不转，不如骑车简单。哈哈~支持一下！

    回复
    1. Tokin Tokin

      @骑行领域：如果一个东西一开始是免费的，那么如果后来收费了，很难让用户接受的…

      回复
      1. 骑行领域 骑行领域

        @Tokin：免费模版归免费模版，完善后，也了解了用户的需求，再开发新模版，收费的。像升级模版一样，限量出售。

        回复
  4. 斌果 斌果

    不错不错

    回复
  5. Teddysun Teddysun

    页面很华丽！
    事实上，有时候人会跟风。你可以第一步做一个免费主题，并且这个主题还不错，放到Wordpress官方网站供下载。
    等你名声在外，卖第二套方案就很容易了。

    回复
    1. Tokin Tokin

      @Teddysun：实际操作起来很困难的，而且我的主题应该不会通过WP官方验证…

      回复
  6. 飘零 飘零

    前来支持

    回复
  7. OYOY OYOY

    好吧，我想买来着。。。

    回复
    1. Tokin Tokin

      @OYOY：早说啊，你要是早说，我就等你买完再免费放出了，哈哈

      回复
  8. 刘荣焕 刘荣焕

    应该就是你最底下的东西

    回复
    1. Tokin Tokin

      @刘荣焕：恩，主题改版，其中比较满意的地方就有页脚…

      回复
  9. 斌果 斌果

    期待中

    回复
  10. 木头怀 木头怀

    哈哈，把你的那个评论横条给扒下来了！

    回复
    1. Tokin Tokin

      @木头怀：额，好吧…

      回复
      1. 木头怀 木头怀

        @Tokin：还想把你那个hover回复放大那个给扒下来，不知道怎么弄！

        回复
        1. 斌果 斌果

          @木头怀：那个是CSS3，长和宽和旋转加过渡

          回复
          1. 木头怀 木头怀

            @斌果：发现IE10和FF都不支持额

            回复
            1. 斌果 斌果

              他好像没给IE和FF添加专有注释呃

              回复
              1. Tokin Tokin

                是的。。没弄

                回复
                1. 斌果 斌果

                  好吧

                  回复
                  1. Tokin Tokin

                    你不是吃饭去了么

                    回复
                    1. 斌果 斌果

                      刚吃完就看见你换背景了，然后利马收到回复邮件提示，一刷新，背景又换回来了

                      回复
                      1. Tokin Tokin

                        正在尝试，怎么才能大气一些。。QQ聊

                        回复
  11. PC丶爱好者 PC丶爱好者

    我只能说又有一个好主题免费分享！！！

    回复
    1. Tokin Tokin

      @PC丶爱好者：主题已发布

      回复
  12. 天域剑客 天域剑客

    浅城····现在你信了吧？新浪云采用的是鹏博士电信通机房就是这家yunhosting.com，常年宕机····

    回复
    1. Tokin Tokin

      @天域剑客：痛苦啊，木有钱了，不然我就搬走了

      回复
      1. Ashe Ashe

        @Tokin：先来我香港空间避难吧 :lol:

        回复
        1. Tokin Tokin

          @Ashe：暂时用不到…额额

          回复
  13. 免费资源部落 免费资源部落

    博主又换主题了？？？

    回复
    1. Tokin Tokin

      @免费资源部落：一直是一个主题，不过我不断改造、升级，每次动的地方都比较大，所以行程了样式鲜明的三个主题，如果算上主题刚动手的那个，已经可以当成四个不同的主题发出来了，哈哈

      回复
  14. 韩麦斯 韩麦斯

    撸过

    回复
  15. 晒太阳的奶酪 晒太阳的奶酪

    .... :?: 我光是维护一个主题就累死我了.

    回复
  16. 晒太阳的奶酪 晒太阳的奶酪

    你的主题细节还不够?真打击到我了.

    回复
  17. 黎健雄 黎健雄

    把你这个主题扒了然后放论坛好不好。。 :lol: :lol: :lol: :lol: :mrgreen: :mrgreen: :mrgreen: :mrgreen: :arrow: :arrow: :arrow: :!: :!: :!: :razz: :razz: :razz:

    回复
    1. Tokin Tokin

      @黎健雄：我去，我打算免费放出的主题。。。 :?:

      回复
  18. 小清 小清

    不是要技术没技术，是虽然效果很炫，功能很多。但是一直没发现有什么统一风格，太杂乱了

    回复
    1. Tokin Tokin

      @小清：主要是看到什么效果感觉不错后就想往主题里填…

      回复
  19. 小众音乐 小众音乐

    这个东东很适合我的透明主题啊，不过我打算用背景渐变

    回复
    1. Tokin Tokin

      @小众音乐：那就给主题加上吧，蛮简单的

      回复
  20. 昌浩 昌浩

    为何吾辈完全不懂jq。。就算看再多的教程，也是看不懂，果然是我太弱了呀。。。

    回复
    1. Tokin Tokin

      因为你是小受，所以看不懂，这些都是小攻们能看懂的

      回复
      1. 昌浩 昌浩

        这个跟攻受有什么关系，再说了以后还有靠受君过活，这样的话不就没人看懂这代码的了……泪奔】

        回复
        1. Tokin Tokin

          额额，我开玩笑的

          回复
  21. CzDuBan CzDuBan

    背景层图片没办法下载？？

    回复
    1. Tokin Tokin

      是的，太过久远，数据找不到了

      回复

添加新评论