速通教程

引入以下脚本内容以兼容pjax

// 游泳
const swimmingChara = `
<div id="swimmingChara" class="kankore-bath hidden-sm hidden-xs">
	<div style="animation: 10s linear 0s normal none infinite waves-r2l;" class="water"></div>
	<div class="shiro kan" href="javascript:;">
		<img src="/mods/kan/shiro.png">
	</div>
</div>
`;

// 判断是否首页
function isHomepage() {
  return window.location.pathname === '/' && !window.location.search;
}

function toggleswimmingChara() {
  const contentContainer = document.getElementById('swimmingChara');

  if (isHomepage()) {
    // 如果在首页并且内容不存在，则插入内容
    if (!contentContainer) {
      document.body.insertAdjacentHTML('beforeend', swimmingChara);

      // 执行脚本
      const script = document.createElement('script');
      script.type = 'text/javascript';
      script.src = '/mods/kan/kancolleconf.js';
      document.body.appendChild(script);
    }
  } else {
    // 非首页移除
    if (contentContainer) {
      contentContainer.remove();
    }
  }
}

// 刷新内容
function refreshswimmingChara() {
  const contentContainer = document.getElementById('swimmingChara');
  if (contentContainer) {
    // 移除旧的载入脚本并重新载入
    const oldScript = document.querySelector('script[src="/mods/kan/kancolleconf.js"]');
    if (oldScript) {
      oldScript.remove();
    }

    // 移除旧的内容
    contentContainer.remove();

    // 插入新的内容
    document.body.insertAdjacentHTML('beforeend', swimmingChara);

    // 重新载入
    const script = document.createElement('script');
    script.type = 'text/javascript';
    script.src = '/mods/kan/kancolleconf.js';
    document.body.appendChild(script);
  }
}

// 首页初始化
toggleswimmingChara();

// 每6秒刷新一次
setInterval(refreshswimmingChara, 60000);

// 监听pjax事件
document.addEventListener('pjax:complete', () => {
  toggleswimmingChara();
  refreshswimmingChara();
});

未开启pjax的站点可以直接下载并引入以下内容：

样式已针对sakurairo的封面波浪纹饰进行修改

https://nicocat.cc/mods/kan/kancolle.css
https://nicocat.cc/mods/kan/kancolle.js

接着在页尾嵌入以下内容：

<div id="swimmingChara" class="kankore-bath hidden-sm hidden-xs">
	<div style="animation: 10s linear 0s normal none infinite waves-r2l;" class="water"></div>
	<div class="shiro kan" href="javascript:;">
		<img src="/mods/kan/shiro.png">
	</div>
</div>

最后再引入载入脚本即可：

https://nicocat.cc/mods/kan/kancolleconf.js