因為一直找不到工作(...汗)所以來整理作品

成果展示

基本上是參考Let's Write做的Demo

在頁面下方有作品導覽以及Github連結

使用工具:
1.Github Page 2.Google Tag Manager

步驟: 1.申請GTM並取得GTM代碼 2.將GTM代碼插入所有專案的index.html中,並將所有專案上傳github,開啟page頁面 3.另外做一個myNavbat的github page,將所有專案連結放進去,可參考我做的 4.用GTM的「自訂HTML」功能將myNavbar和github連結塞進所有專案中,參考代碼如下:

    <link
      rel="stylesheet"
      href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"
    />

    <div class="myNav"></div>

    <div class="github">
      <a class="githubHerf">
        <i class="fa fa-github" aria-hidden="true"></i>
      </a>
    </div>

<script>
var githubHerf=document.querySelector(".githubHerf")
githubHerf.setAttribute("href","https://github.com/superyngo"+{{Page Path}})

var myNav2 = document.querySelector(".myNav");
var iframe2 = document.createElement("iframe");
iframe2.setAttribute("src", "https://superyngo.github.io/myNavbar/");
iframe2.setAttribute("width", "100%");
iframe2.setAttribute("frameborder", "0");
myNav2.appendChild(iframe2)
</script>

<style>
body{
    background-color: #fff0df;
  }
.github {
  position: fixed;
  left: 0;
  bottom: 0;
  display: flex;
  width: 100px;
  height: 100px;
  cursor: pointer;
  z-index: 2;
  :hover {
    position: absolute;
    left: 10px;
    bottom: 5px;
    font-size: 3rem;
    color: #fff;
    scale: 0.9;
  }
}
.github::before {
  content: "";
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 100px 0 0 100px;
  border-color: transparent transparent transparent #6e5494;
}
.github .fa {
  position: absolute;
  left: 10px;
  bottom: 5px;
  font-size: 3rem;
  color: #fff;
}

@media screen and (max-width: 600px) {
  :root {
    font-size: 12px;
  }
  .github {
    width: 70px;
    height: 70px;
  }
  .github::before {
    border-width: 70px 0 0 70px;
  }
  .github .fa {
    left: 8px;
    bottom: 4px;
    font-size: 2rem;
  }
}
</style>

注意事項; 1.不知為何我GTM塞iframe一直不給過,所以用append的。 2.iframe內的超連結預設會在iframe內開啟,要避免只要在myNavbar的head裡加上就可以了。 3當初做這些作業時完全沒考慮theme和RWD,花了一些時間但又不想花太多時間結果就勉勉強強用手機也都能開。

閒聊: 前陣子都在codeSignal上刷題,看別人解法真的很神,學很多... 有沒有北部公司缺人啊...投履歷都沒人回..中年轉行真的不行嗎...


共有 2 則留言

中年轉行應該不成問題,滿多公司就是缺人,應該沒那麼在乎年齡

按照我之前提的方式,履歷表列出那些作業,應該會引起不少公司的興趣才對

https://codelove.tw/@howtomakeaturn/post/k31dYx

104、yourator、甚至臉書的 Front-end 社團,再留意一下,找找看?

https://www.facebook.com/groups/521085554595481

按讚的人:

還有這邊也可以參考看看

https://github.com/f2etw/jobs/issues

按讚的人: