---
# System prepended metadata

title: 第七週小組任務 - 切版班 12 組
tags: [網頁切版直播班 - 2022 夏季班]

---

---
tags: 網頁切版直播班 - 2022 夏季班
---

# 第七週小組任務 - 切版班 12 組
> 討論日期及時間 > 2022/08/20 20:30-21:30
> 
**組員參與名單(8/10)：**
* christina#6185
* yuyu#6310
* hungya#0773
* yichih#6223
* Winnie Wu#5468
* DoraHuang#8223
* 此暱稱已被使用#6514
* 維新#6472

---
> **希望助教轉達這段給老師XD 
> 來自12組對這次課程的心得**
![](https://i.imgur.com/AprAmWX.png)
![](https://i.imgur.com/CKIWkUq.png)


---
## 問題

請每個小組討論成員，試著用本週教的視差效果，並套用在自己的版型上，彼此協助除錯，並提交到任務系統上。

這任務請回傳討論對話截圖即可。

答：

```
//step1
//css
<link href="https://unpkg.com/aos@2.3.1/dist/aos.css" rel="stylesheet">

//step2
//js
//要加在AOS.init();前面
<script src="https://unpkg.com/aos@2.3.1/dist/aos.js"></script>

//step3
//INITIALIZE AOS
<script>
  AOS.init();
</script>

//step4
//add css
<div data-aos="fade-up"
     data-aos-anchor-placement="top-bottom">
</div>

```

[老師示範的Codepen 連結](https://codepen.io/liao/pen/yLKZJjR)


![](https://i.imgur.com/xoVQ7JD.png)

![](https://i.imgur.com/BKHZpq2.png)

![](https://i.imgur.com/8q4ijiT.png)


---

> 謝謝今天有參與的同學們！(剩ㄧ週!!)  :100: 
<iframe src="https://giphy.com/embed/Q1D2YJnWHX20w" width="480" height="360" frameBorder="0" class="giphy-embed" allowFullScreen></iframe><p><a href="https://giphy.com/gifs/hqg-rhighqualitygifs-Q1D2YJnWHX20w"></a></p>