###### tags: `前端`
# 網站特效參考 - 茹

---

<table>
<tr>
<td></td>
<th>登錄頁面</th>
<th>nav</th>
<th>footer</th>
<th>覺得很厲害但是不知道用在哪邊的網站</th>
</tr>
<tr>
<th>亮點</th>
<td style="width:100px">**地球**剛進入網站會有一棵可以動的地球互動，使用者可以從地球上面直接選要去哪個州，這樣就不用從選單上面選擇，便可以迅速到想要去的地方。我的想法是可以在地圖旁邊放一個skip，如果不想從地圖選地方的話，可以直接跳過這個步驟。<br>
****登入漢堡的icon****<br>
我的想法是可以再登入地圖前，放一個有在動的等待icon，圖形可以用飛機在飛或是有人在騎腳踏車等等。
</td>
<td>
****nav可以參考****<br>https://harvest.corto-olive.com/<br>
</td>
<td></td>
<td>
****會翻轉的圓圈**** <br>https://pu- ca.jp/<br>
****滑鼠有一個提示點****而 且還會出現return，可以返 回上一頁。 <br>https://designerdram.com/
****fb和ig圖標會翻轉**** <br>https://designerdram.com/<br>
****飛機和雲帶出495 vodca那 邊****<br>
https://495.vodka/<br>
****整個網站圖片部分都可以參考****<br>https://harvest.corto-olive.com/<br>
</td>
</tr>
<tr>
<th>網站</th>
<td>
https://100ytlc.com/en-en/map(地球)<br>
https://thegoodburger.com/en(漢堡icon)
</td>

</table>
https://munjoi.com/
待續..............

<hr>
<h2>Loading畫面</h2>

-[漢堡icon](https://thegoodburger.com/en)

<p>
**登入漢堡的icon**
我的想法是可以再登入地圖前，放一個有在動的等待icon，圖形可以用飛機在飛或是有人在騎腳踏車等等。
</p>

<h2>首頁</h2>

<h3>nav:</h3>

<p>

-[NAV](https://harvest.corto-olive.com/)
-[固定nav](http://midori.so/contact)

</p>

<hr>

<h3>main:</h3>

-[地球](https://100ytlc.com/en-en/map)

<p>
**地球**剛進入網站會有一棵可以動的地球互動，使用者可以從地球上面直接選要去哪個州，這樣就不用從選單上面選擇，便可以迅速到想要去的地方。我的想法是可以在地圖旁邊放一個skip，如果不想從地圖選地方的話，可以直接跳過這個步驟。

-[移動式nav](https://fukuhada.com/) 雖然這個網站長得像nav的不倒翁沒功能，但我覺得我們能做成有nav功能的圖形，方便使用者快速搜尋資訊。
</p>

<hr>

<h3>側拉式選單:</h3>
<p>

-[網址](https://www.html5tricks.com/demo/css3-mobile-slider-menu/index2.html)
</p>

<hr>

<h3>footer:</h3>

<p>

-[有圖案的footer](zensho-ji.com/)

</p>
<hr>

<h3>其他:<h3>

### 覺得厲害的網站
[出海網站](https://pu-ca.jp/)

[會翻轉的圓圈](https://pu-ca.jp/)

[酒品網站](https://designerdram.com/)
- 滑鼠有一個提示點而且還會出現return，可以返回上一頁。
- fb和ig圖標會翻轉

[黑白風酒品網站](https://495.vodka/)
- 飛機和雲帶出495vodca那邊、視差滾動

[黑白風酒品網站](https://harvest.corto-olive.com/)
- 整個網站圖片部分都可以參考

[爺爺奶奶寺廟網站](https://zensho-ji.com/diary/uservoice/)
- 整體網站可參考，風格活潑

[顏氏牧場](https://www.yenpasture.com/)
- 會跟著鼠標移動的icon