微件:GGLScratchGame：修订间差异

来自Limbo Wiki Mirror
←上一编辑下一编辑→
可视化wikitext
Gaoice​（留言 | 贡献）
行政员、​界面管理员、​管理员
951次编辑
无编辑摘要
Gaoice​（留言 | 贡献）
行政员、​界面管理员、​管理员
951次编辑
无编辑摘要
标签：（旧）WikiEditor
第1行： 第1行：
<noinclude>
<noinclude>
Cyber Scratch Lottery Widget
刮刮乐 Widget（稳定版）
</noinclude>
</noinclude>


<includeonly>
<includeonly>
<div class="ggl-wrapper">
  <div class="ggl-ticket">
    <div class="ggl-reveal"></div>
    <div class="ggl-grid"></div>
  </div>
</div>


<style>
<style>
.ggl-wrapper {
.ggl-wrapper {
   max-width: 360px;
   width: 360px;
   margin: 30px auto;
   margin: 20px auto;
  font-family: sans-serif;
}
}


第18行： 第24行：
   background-image: url("https://wm.gaoice.run/images/thumb/b/b6/%E5%9B%BE%E7%89%871.png/180px-%E5%9B%BE%E7%89%871.png");
   background-image: url("https://wm.gaoice.run/images/thumb/b/b6/%E5%9B%BE%E7%89%871.png/180px-%E5%9B%BE%E7%89%871.png");
   background-size: cover;
   background-size: cover;
   border-radius: 16px;
  background-position: center;
   border-radius: 12px;
   overflow: hidden;
   overflow: hidden;
}
}


/* 刮开后图 */
/* 刮开后 */
.ggl-reveal {
.ggl-reveal {
   position: absolute;
   position: absolute;
第30行： 第37行：
}
}


/* 刮刮乐网格 */
/* 30 格 */
.ggl-grid {
.ggl-grid {
   position: absolute;
   position: absolute;
   inset: 0;
   inset: 0;
   display: grid;
   display: grid;
   grid-template-columns: repeat(6, 1fr);
   grid-template-columns: repeat(5, 1fr);
   grid-template-rows: repeat(5, 1fr);
   grid-template-rows: repeat(6, 1fr);
}
}


/* 每一个刮块 */
.ggl-cell {
.ggl-cell {
  position: relative;
   background-image: url("https://wm.gaoice.run/images/thumb/5/5a/%E5%88%AE%E5%BC%80%E5%89%8D.png/180px-%E5%88%AE%E5%BC%80%E5%89%8D.png");
   background-image: url("https://wm.gaoice.run/images/thumb/5/5a/%E5%88%AE%E5%BC%80%E5%89%8D.png/180px-%E5%88%AE%E5%BC%80%E5%89%8D.png");
   background-size: cover;
   background-size: cover;
第49行： 第54行：
.ggl-cell.scratched {
.ggl-cell.scratched {
   background: transparent;
   background: transparent;
}
/* 气泡 */
.ggl-bubble {
  position: absolute;
  bottom: 110%;
  left: 50%;
  transform: translateX(-50%);
  background: rgba(0,0,0,0.85);
  color: #0f0;
  font-size: 12px;
  padding: 4px 6px;
  border-radius: 6px;
  white-space: nowrap;
  display: none;
  z-index: 5;
}
.ggl-cell.scratched .ggl-bubble {
  display: block;
}
}
</style>
</style>
<div class="ggl-wrapper">
  <div class="ggl-ticket">
    <div class="ggl-reveal"></div>
    <div class="ggl-grid" id="gglGrid"></div>
  </div>
</div>


<script>
<script>
(function () {
(function () {
  var wrapper = document.currentScript.parentNode;
  var grid = wrapper.querySelector('.ggl-grid');


const texts = {
   if (!grid) return;
   1: '',
  2: '(｀・ω・´)📡',
  3: '(≧▽≦)ﾉ',
  4: '(・_・?)',
  5: '(；ﾟДﾟ)',
  6: '你点的是哪里？',
  7: '… … …',
  8: '嘿、哈、别挠',
  9: '你是谁？',
  10: '停下来',
  11: '平安喜乐'
};
 
let state = 1;
const grid = document.getElementById('gglGrid');
 
for (let i = 0; i < 30; i++) {
  const cell = document.createElement('div');
  cell.className = 'ggl-cell';
 
  const bubble = document.createElement('div');
  bubble.className = 'ggl-bubble';
  bubble.textContent = texts[state];
 
  cell.appendChild(bubble);
 
  cell.onclick = () => {
    if (cell.classList.contains('scratched')) return;
 
    cell.classList.add('scratched');
    bubble.textContent = texts[state];
 
    if (state < 11) state++;
  };
 
  grid.appendChild(cell);
}


  for (var i = 0; i < 30; i++) {
    var cell = document.createElement('div');
    cell.className = 'ggl-cell';
    cell.onclick = function () {
      this.classList.add('scratched');
    };
    grid.appendChild(cell);
  }
})();
})();
</script>
</script>


</includeonly>
</includeonly>

2026年2月1日 (日) 17:23的版本

刮刮乐 Widget（稳定版）


检索自“https://mirror.awakenplace.top/index.php?title=微件:GGLScratchGame&oldid=51616”