没有想好标题的改动

 

千千的ACM集训是从上周四结束的,最后一周的假期,用来做什么呢?

 

  • 继续学习算法?(每天只是看了一点儿)
  • 让网站更好看一点儿?(暂时完成)
  • 学习英语?(发现真的没有时间)

这些就是这几天我所做的事情,😭可是英语怎么办、、、

 

从发表这篇文章开始,近期不会对网站做什么大一点的改动了😢

 

原因:

  • 很耗费时间的样子唉!
  • 因为有更更重要的事情还没有做
  • 校园网的流量不够了(23号刚刷新的流量到现在只剩下1G了)
  • 快要开学了,该做点开学时候的事情了😌(这句话是随便说的,毕竟没有作业)

 


 

那么,接下来就说说对网站的改动吧!(只是记录)

  • 更换站点标题与站点背景图片
  • 全站半透明化,已添加恢复按钮
  • 后台去除一些插件,功能已移植到主题
  • 添加了DIYgod酱的Aplayer播放器(侧边栏就有哦)
  • 顶部header根据滚动条状态自动隐藏与出现
  • 重写整站架构,优化代码,使得执行效率更高
  • 优化数据库内部,去掉无用的数据
  • 移除NProgress.js加载条与原来的Highslide.js图片灯箱
  • 添加新的,更流畅,更轻便的灯箱插件zoom.js
  • 成功升级到WordPress4.6(然后发现原来的emoji替换方法失效了,已禁用)
  • 添加新的打字特效(曾经在Atom上用过,三秋酱推荐)
  • 开启全站pjax,访问更快(以前好像有说过开启全站https😄)
  • 开启双主题模式(或许没有人关注这个吧)

 


 
某天无聊突然想在网上找找看有没有什么好点的图片作为站点背景(也就是现在这张了)

同时也发现了一个(感觉和我很像)的动漫人物。

background

  上面这张图是我用了好长时间从原图抠出来的,绝对精细,所以,😭不想要在不告诉我的情况下盗取它

 
  换好背景之后又想到如果站点是半透明效果的话会是怎么样的呢?
 
  开启审查元素,更改必要块的#fff更改为rgba(255,255,255,.6)看了一下效果,感觉不错的样子,第二天正式开工。
 
  改完半透明效果之后才想起来要做模块化的设计,也就是随时可以去掉这种效果,没办法了,只能靠其他方法实现了。

 

最终的解决方案:按钮

古娜拉黑暗之神、魔法、消失(°∀°)ノ

 
  按钮实现思路:更改div内容含<style></style>覆盖原来的样式。(不用document.write()的原因是因为输出流已关闭,这样会清空页面内容)

 

  至于站点标题呢!怎么说一直用同学的网名也不太好吧,所以自己想了一个最适合自己的名称,夢の彼方は千千

 

  不知道从什么时候开始就不喜欢长的代码,(因为太长提交结果TLE会很伤心)因为太长会导致文件变大加载变慢,然后整个站点的速度也会有影响,虽然这种影响真的很小很小,或许这一切真的只是我自己的意愿吧!花了点时间重写了站点的架构,重写了某些方法,终于改到了感觉还算满意的状态。

 

另外,新的打字特效可以在评论框里面测试哦~

或者:(看这里啦!图片是吉吉学长那里找到的)

 
10f16456-9c65-11e5-8af4-265f01fc83a0

 

  最近,同时也是最后啦!做的最棒的一件事就是开启全站pjax

 
  看了好多教程,看了好多文档,每一个实现都看起来好简单,可是自己做起来还是没有办法成功,然后,下载了几个pjax的主题,看懂了。😎(能看懂代码的我真好)

 

  对于我这个主题来说,整个站点就算包含四部分吧!(头部,文章区,侧边栏,底部)
 
  当你打开浏览器,第一次进入这里的时候,所有内容都会加载。

  因为设定文章区作为pjax的替换容器

  所以在<a></a>排除规则以外的链接,访问的时候都不会重新加载头部、侧边栏与底部的,只会刷新文章区的内容,同时url也会变哦!(解决了ajax的难题)

 
  也正是因为异步加载的原因,可能会出现一些奇怪的错误,还需要慢慢测试的样子唉~

 
(当我弄好pjax的时候,想了想真的和网上说的一样简单)

 


THE END


  • 26 只已被捕捉
    • 一日 Chrome | 52.0.2743.116 Windows 10

      取消半透明的按钮是用js实现的吗?能给出代码吗?我想研究一下

      • 一日 Chrome | 52.0.2743.116 Windows 10

        就是 点击后按钮文字变化,css覆盖以前的css,再次点击按钮文字又变回来了,css也变回来了,这个怎么实现的啊 研究半天也弄不成功

        • 千千 Edge | 14.14915 Windows 10 Moblie

          点击更改css,再点击取消这个状态!

          • 一日 Chrome | 33.0.0.0 Android 4.4.4

            我再试试!你知道的,我是渣渣啊。。每次改都得百度。。

            • 千千 Chrome | 49.0.2623.75 Windows 10

              一个id为alpha的div,给它设定一个事件,点击之后替换div里面内容是一段CSS,再点击的话把里面的CSS清空就可以了

    • 天朝学子博客 搜狗浏览器 Windows XP

      这个网站很有个性啊

      • 千千 Mozilla FireFox | 50.0 Windows 10

        O(∩_∩)O哈哈~,当然

    • 三秋 Mozilla FireFox | 48.0 Windows 10

      终于可以回复了。

      • 千千 Mozilla FireFox | 50.0 Windows 10

        O(∩_∩)O哈哈~,不错哦~我的打字特效很耗CPU么?

    • 佛山影视 Chrome | 45.0.2454.101 Windows 7

      最近想要改个网站,犯懒,一个月了还没改好

      • 千千 Mozilla FireFox | 50.0 Windows 10

        什么样的网站呢?

        • 佛山影视 Chrome | 45.0.2454.101 Windows 7

          一个影视企业的官网,主要是没耐心坐下来慢慢改,看见代码就头疼犯懒。

          • 千千 Mozilla FireFox | 50.0 Windows 10

            因为这些改起来都很麻烦的,所以好累