西港國小-校園內網

學生OpenID介紹
==========

<button aria-label="複製電子郵件帳號：st@cloud.tn.edu.tw" class="btn btn-primary btn-lg btn-rounded" data-clipboard-text="st@cloud.tn.edu.tw" id="copy-btn" type="button"> 複製帳號 </button> <span aria-live="polite" class="visually-hidden" id="copy-status"></span> </div> </section>---

<section aria-labelledby="tutorial-title">Office 365 登入教學
---------------

<div class="alert alert-primary">### 電腦版登入步驟

1. 前往 [ Office 官方網站 (www.office.com) ](https://www.office.com "前往 Office 官方網站 (另開新視窗)")
2. 點選網頁右上方**「登入」**。
3. 在電子郵件欄位輸入：  
     <kbd style="font-size: 1.1rem; background-color: #333; color: #fff; padding: 2px 5px; border-radius: 3px;">st@cloud.tn.edu.tw</kbd>
4. 輸入您的 **OpenID 帳號及密碼** 即可登入。
 
 </div><div class="alert alert-secondary mt-3">### 行動裝置 (平板/手機)

請下載 Office 或 Teams App，並使用上述帳號登入。

</div> </section> </div> </article> <script>
  // 初始化剪貼簿功能，並確保目標為正確的按鈕物件
  document.addEventListener('DOMContentLoaded', function() {
    const copyBtn = document.getElementById('copy-btn');
    const copyStatus = document.getElementById('copy-status');
    
    if (typeof ClipboardJS !== 'undefined') {
      const clipboard = new ClipboardJS(copyBtn);

clipboard.on('success', function(e) {
        const originalText = copyBtn.innerText;
        
        // 視覺反饋
        copyBtn.innerText = "已複製帳號！";
        copyBtn.classList.replace('btn-primary', 'btn-success');
        
        // 無障礙語音反饋
        copyStatus.innerText = "帳號 st@cloud.tn.edu.tw 已成功複製到剪貼簿";
        
        setTimeout(function() {
          copyBtn.innerText = originalText;
          copyBtn.classList.replace('btn-success', 'btn-primary');
          copyStatus.innerText = ""; 
        }, 2000);
        
        e.clearSelection();
      });

clipboard.on('error', function(e) {
        copyStatus.innerText = "複製失敗，請手動選取文字";
      });
    }
  });
</script>