友人C

樱花飘落特效 js 代码_( ゚Д゚)ノ
最近在看《四月是你的谎言》,还没有看完,挺好看的!看来我要掉日漫的坑了!然后,里面出现了很多樱花的画面,很美是么,...
扫描右侧二维码阅读全文
01
2016/09

樱花飘落特效 js 代码_( ゚Д゚)ノ

最近在看《四月是你的谎言》,还没有看完,挺好看的!看来我要掉日漫的坑了!然后,里面出现了很多樱花的画面,很美是么,所以我需要这个!

效果就是本站的效果啦!

四月是你的谎言.jpg

CSS文件

<link type="text/css" rel="stylesheet" media="screen" href="https://www.ihewro.com/texiao/yinghua/jquery-sakura.css" />

加载js文件

注意:因为我测试了一下下哈,在手机上用这个特效滑动有点不顺畅,不知道是不是我的手机不行==,所以我做了判断,屏幕小的话是不会加载这个js的。

<script>
if (screen && screen.width > 480) {
  document.write('<script src="https://www.ihewro.com/texiao/yinghua/jquery-sakura.js"><\/script><script type="text/javascript">$(function(){$("body").sakura()});$(window).load(function(){$("body").sakura()});<\/script>');
}
</script>

发现在手机UC浏览器还是能加载特效,于是改成了下面这种

<script>
if( /Android|webOS|iPhone|iPod|iPad|BlackBerry/i.test(navigator.userAgent))
{}
else
{  document.write('<script src="https://www.ihewro.com/texiao/yinghua/jquery-sakura.js"><\/script><script type="text/javascript">$(function(){$("body").sakura()});$(window).load(function(){$("body").sakura()});<\/script>');}
</script>

参考文章

樱花飘落特效 js 代码
手机端不加载js文件,PC端要加载js文件,怎么做的?

最后修改:2016 年 10 月 29 日 05 : 29 PM
如果觉得我的文章对你有用,请随意赞赏

48 条评论

  1. xema

    两张图片好像是挂了吧

    1. 友人C
      @xema

      对 这图片地址ihewro.com域名的

  2. 有点女性化了 #[吐舌]

    1. 一日
      [捂嘴笑]
  3. 闲鱼
    [滑稽]逼格不错
    1. 一日
      @闲鱼 [滑稽]谢谢!
  4. 三秋

    老司机推荐上dilidili看魔装学院,从此世界变颜色。#[滑稽]

    1. 一日
      @三秋 一搜索魔装学院 \"魔装学园H×H无删减\"#[滑稽]
      1. 三秋
        @一日

        老司机深情推荐。

  5. 超级男孩
    [不高兴]
  6. 拾叁同学

    博主请教一个问题,怎么自定义浏览器滚动条?怎么实现的?另外,你的站一天挂几次了0 0……

    1. 一日
      @拾叁同学

      加点CSS就行。只能支持webkit内核浏览器(大部分浏览器)/* *webkit浏览器滚动条样式 */ ::-webkit-scrollbar { height:8px; width:6px; } ::-webkit-scrollbar-button { height:0; width:0; } ::-webkit-scrollbar-button:start:decrement,::-webkit-scrollbar-button:end:increment { display:block; } ::-webkit-scrollbar-button:vertical:start:increment,::-webkit-scrollbar-button:vertical:end:decrement { display:none; } ::-webkit-scrollbar-track:vertical,::-webkit-scrollbar-track:horizontal,::-webkit-scrollbar-thumb:vertical,::-webkit-scrollbar-thumb:horizontal,::-webkit-scrollbar-track:vertical,::-webkit-scrollbar-track:horizontal,::-webkit-scrollbar-thumb:vertical,::-webkit-scrollbar-thumb:horizontal { border-style:solid; border-color:transparent; } ::-webkit-scrollbar-track:vertical::-webkit-scrollbar-track:horizontal{ background-clip:padding-box; background-color:#fff; } ::-webkit-scrollbar-thumb { -webkit-box-shadow:inset 1px 1px 0 rgba(0,0,0,.1),inset 0 -1px 0 rgba(0,0,0,.07); background-clip:padding-box; background-color:rgba(0,0,0,.5); min-height:28px; padding-top:100px; } ::-webkit-scrollbar-thumb:hover { -webkit-box-shadow:inset 1px 1px 1px rgba(0,0,0,.25); background-color:rgba(0,0,0,.4); } ::-webkit-scrollbar-thumb:active { -webkit-box-shadow:inset 1px 1px 3px rgba(0,0,0,.35); background-color:rgba(0,0,0,.5); } ::-webkit-scrollbar-track:vertical,::-webkit-scrollbar-track:horizontal,::-webkit-scrollbar-thumb:vertical,::-webkit-scrollbar-thumb:horizontal { border-width:0; } ::-webkit-scrollbar-track:hover { -webkit-box-shadow:inset 1px 0 0 rgba(0,0,0,.1); background-color:rgba(0,0,0,.05); } ::-webkit-scrollbar-track:active { -webkit-box-shadow:inset 1px 0 0 rgba(0,0,0,.14),inset -1px -1px 0 rgba(0,0,0,.07); background-color:rgba(0,0,0,.05); } /* * end webkit浏览器滚动条样式 */

      1. 拾叁同学
        @一日

        加在哪里

        1. 一日
          @拾叁同学

          CSS文件 加到 head.php的标签前面js文件 加到foot.php

          1. 拾叁同学
            @一日

            JS文件在哪?我要报警了

            1. 一日
              @拾叁同学

              这里面的有一个js地址哇http://www.ihewro.com/texiao/yinghua/jquery-sakura.js

    2. 一日
      @拾叁同学

      前天下午主机商那边说机房迁移,挂了半天== 今天也挂了吗?

      1. 拾叁同学
        @一日

        今天我发现你的站挂了2次

        1. 一日
          @拾叁同学

          最近几天确实不稳定

        2. 一日
          @拾叁同学 看来以后得换一个主机
          1. 拾叁同学
            @一日

            欢迎来看看我的第一篇文章,有提到老薛主机,真心不错。可以按季付。还可以买独立IP 一个月15.真心挺划算的。过几天等学生证下来就去看看阿里的学生主机了。大学生福利#(小眼睛)

            1. 一日
              @拾叁同学

              阿里云的学生主机要备案哒,感觉好麻烦==,以后还是换老薛主机吧

              1. Sealt
                @一日

                如果要主机的话可以迁移到我的IDCF机子喵(๑•̀ㅁ•́ฅ),LNMP1.3[PHP5.6],一直用着蛮不错的。

                1. 友人C
                  @Sealt

                  3Q辣,如果备案成功的话只能用国内主机了

                  1. Sealt
                    @友人C

                    並不是哦,我的博客備案了,然而用的就是IDCF,貌似阿里雲騰訊雲不可以QAQ,୧(๑•̀⌄•́๑)૭

              2. 拾叁同学
                @一日

                备案只是域名备案撒,域名备案并不麻烦,只要你有阿里云的云主机或者虚拟主机就可以免费备案。域名最好还是备案好一点,毕竟很多CDN服务商都是要求域名备案的,比如七牛

  7. 三秋

    一入B站深似海。

    1. 一日
      @三秋

      从此#[滑稽]

发表评论