已有 28 条评论
  1. charlotte

    大佬,脚本现在用不了了,好像是翻译拼接错误,我也不懂
    |´・ω・)ノ

    charlotte October 18th, 2019 at 02:31 pm回复
    1. journey.ad

      彩云和搜狗都改了算法,暂时先用谷歌翻译吧

      journey.ad October 18th, 2019 at 07:39 pm回复
  2. Fabrizio Col

    写的不错

    Fabrizio Col August 1st, 2019 at 05:46 pm回复
  3. TsukiSeele

    |´・ω・)ノ

    TsukiSeele May 26th, 2019 at 06:34 pm回复
  4. 黑王

    楼主你好,请问可不可以提供 datacamp 的支持呀?我试着改你的代码,但是js一点也没学过。。⌇●﹏●⌇

    黑王 April 26th, 2019 at 05:54 pm回复
  5. zhensjoke

    加个友链中不中,

    zhensjoke April 16th, 2019 at 09:56 am回复
    1. journey.ad

      中中,加上了

      journey.ad April 16th, 2019 at 04:53 pm回复
  6. nice

    技術大牛!

    nice April 4th, 2019 at 09:56 am回复
  7. 揽月

    博主你好,我想问下你这个站的图片点击之后显示大图用的是哪个插件,我这没搞定,劳烦了

    揽月 March 27th, 2019 at 07:42 am回复
    1. journey.ad

      不是插件,是几年前刚接触建站时在网上找到的代码,基于jQuery
      虽然也想过要换用更流行的库或者重写一遍,但因为“又不是不能用”,所以一直用到了现在🌝
      参考:

      /*ImageBox*/
      $("p img").addClass("ImageBox");
      $(".ImageBox").click(function() {
          $("body").append('<div class="image-box-plugin"><div class="image-box-container"><div class="spinner" id="image-box-loading" style="display: none;"><div class="rect1"></div><div class="rect2"></div><div class="rect3"></div><div class="rect4"></div><div class="rect5"></div></div><img id="image-box-img"><img id="image-box-fake" onload="$(\'#image-box-img\').attr(\'src\',this.src);$(\'#image-box-loading\').hide();$(\'#image-box-img\').show();" onerror="this.src=\'https://img.imjad.cn/images/2016/12/23/404.jpg\';" src="' + ($(this).attr("data-src") || $(this).attr("src")) + '" style="display: none;"></div></div>');
          var imgW = $(this).width()
            , imgH = $(this).height()
            , scrW = document.body.clientWidth
            , scrH = window.screen.availHeight;
          var newW = $(this).width()
            , newH = $(this).height()
            , scale = imgW / imgH;
          if (imgW > scrW) {
              newW = scrW;
              newH = newW / scale;
              console.log(newH);
              console.log(scrH);
              $(".image-box-plugin img").css({
                  "height": ""
              });
              $(".image-box-plugin img").css({
                  "width": newW
              });
              if (newH > scrH) {
                  newH = scrH;
                  newW = newH * scale;
                  console.log("2333");
                  $(".image-box-plugin img").css({
                      "width": ""
                  });
                  $(".image-box-plugin img").css({
                      "height": newH
                  })
              }
          } else {
              if (imgH > scrH) {
                  newH = scrH;
                  newW = newH * scale;
                  $(".image-box-plugin img").css({
                      "width": ""
                  });
                  $(".image-box-plugin img").css({
                      "height": newH
                  });
                  if (newW > scrW) {
                      newW = scrW;
                      newH = newW / scale;
                      $(".image-box-plugin img").css({
                          "height": ""
                      });
                      $(".image-box-plugin img").css({
                          "width": newW
                      })
                  }
              }
          }
          $(".image-box-plugin").fadeIn(500, function() {
              $(".image-box-plugin").css({
                  "display": "table"
              })
          });
          $(".image-box-plugin img, .image-box-plugin, .image-box-container").bind("click", function() {
              $(".image-box-plugin").fadeOut(500, function() {
                  $(".image-box-plugin").remove()
              })
          })
      });
      
      /*ImageBox*/
      .image-box-plugin {
          position: fixed;
          top: 0;
          left: 0;
          text-align: center;
          width: 100%;
          height: 100%;
          background-color: rgba(253,246,243,0.9);
          z-index: 999;
          display: none
      }
      
      .image-box-plugin img {
          min-width: 20%;
          max-width: 100%;
          max-height: 100%;
          cursor: -webkit-zoom-out;
          cursor: -moz-zoom-out;
          cursor: zoom-out;
      }
      
      .image-box-plugin .image-box-container {
          position: absolute;
          top: 50%;
          -webkit-transform: translate3D(0,-50%,0);
          transform: translate3D(0,-50%,0);
          width: 100%;
          height: 100%;
          text-align: center;
          display: -moz-box;
          -moz-box-align: center;
          -moz-box-pack: center;
          display: -webkit-box;
          -webkit-box-align: center;
          -webkit-box-pack: center;
          display: -o-box;
          -o-box-align: center;
          -o-box-pack: center;
          display: -ms-box;
          -ms-box-align: center;
          -ms-box-pack: center;
          display: box;
          box-align: center;
          box-pack: center;
      }
      
      .ImageBox {
          max-width: 100%;
          cursor: -webkit-zoom-in;
          cursor: -moz-zoom-in;
          cursor: zoom-in;
          transition: all 0.6s;
      }
      
      .ImageBox:hover {
          transform: scale(1.03);
          -webkit-animation-timing-function: ease-in-out;
          -webkit-animation-name: breathe;
          -webkit-animation-duration: 2700ms;
          -webkit-animation-iteration-count: infinite;
          -webkit-animation-direction: alternate;
      }
      
      @-webkit-keyframes breathe {
          0% {
              border: 1px solid rgba(153, 196, 251, 0.8);
              box-shadow: 0 1px 5px rgba(133, 213, 245, 0.8);
          }
      
          100% {
              border: 1px solid rgba(153, 196, 251, 0.8);
              box-shadow: 0 1px 25px rgba(133, 213, 245, 0.8);
          }
      }
      
      journey.ad March 27th, 2019 at 09:17 pm回复
  8. 我是个弟弟

    我是个弟弟 March 13th, 2019 at 09:02 pm回复
  9. 我是个弟弟

    跪求大佬qq,希望能得到大哥的指点

    我是个弟弟 March 13th, 2019 at 08:59 pm回复
  10. 喵

    特别喜欢音乐的播放器还有颜文字的表情,不知道能不能提供这2个的源码学习下,万分感谢~(☆ω☆)

    March 7th, 2019 at 11:03 am回复
    1. journey.ad

      用到的项目是这两个:
      cPlayer V2:MoePlayer/cPlayer
      OwO:DIYgod/OwO

      本站播放器用的journey-ad/cPlayer-Typecho-Plugin插件

      journey.ad March 7th, 2019 at 01:06 pm回复
      1. Sagimune

        您好,Cplayer添加网易云音乐函数为player.add163(12345678),请问具体如何使用?(我是一个连门都没入的JS菜鸡)

        Sagimune March 9th, 2019 at 02:19 pm回复

说点什么? 取消回复

返回顶部