These are chat archives for JsTainan/chat

29th
Mar 2016
Sean Chen
@opjlmi
Mar 29 2016 00:54
casper (frontend-kaohsiung)
e.preventDefault();
casper (frontend-kaohsiung)
加了之後會移除預設的動作,如果 href 是其他連結也會無效
Sean Chen
@opjlmi
Mar 29 2016 01:19
chungchiehlun (frontend-kaohsiung)
https://github.com/reactjs/react-basic
Sean Chen
@opjlmi
Mar 29 2016 02:22
tillhsu (frontend-kaohsiung)
好像加了bind body 那行就可以繼續連結,但可以停止畫面跳動
maplenote (frontend-kaohsiung)
@tillhsu 你應該加錯地方了,jQuery('body').bind()的話 你會整個頁面都套用,所有focus的效果就掛了
tillhsu (frontend-kaohsiung)
@@
maplenote (frontend-kaohsiung)
應該是加在 li 的 click 上
maplenote (frontend-kaohsiung)
往上跳是因為# 的關係 只要他不要觸發href=“#” 就可以了
tillhsu (frontend-kaohsiung)
maplenote (frontend-kaohsiung)
現在好像很少人知道# 是什麼,前陣子同事也問我,google 很難找到老範例可以講解 bookmark 原本的用途,#說不重要又很重要
tillhsu (frontend-kaohsiung)
我把那段移進去了,感謝
Sean Chen
@opjlmi
Mar 29 2016 03:29
jellynina (frontend-kaohsiung)
所以,#,是什麼?
opjlmi (nodejstw)
react的tutorial就有用
可以直接到達網頁某一位置?

maplenote (frontend-kaohsiung)
超連結的書籤 很長一篇文章的時候,用來做快速跳轉的,最常看到就是"回到最頂端”
<a name="取個名稱”>做標記位置</a>
<a href=“#取個名稱”>TOP</a> <———點這個連結就會切換過去

當#都沒有取名,或者找不到的時候,就會轉到頁面最上面

maplenote (frontend-kaohsiung)
因為 <a href=“”> 這樣會轉到404錯誤頁面 所以大家會習慣寫<a href=“#">
maplenote (frontend-kaohsiung)
HTML5也支援 <a id=“取個名稱”> 的寫法
Sean Chen
@opjlmi
Mar 29 2016 03:34
rayway30419 (frontend-kaohsiung)
id直覺多了
maplenote (frontend-kaohsiung)
這不只有單頁切換 也能從A頁跳轉到B頁的某一個書籤 網址就會寫 b.html#xyz
maplenote (frontend-kaohsiung)
另外書籤會記錄到瀏覽歷史之中 是一個很特別的功能 你按返回上一頁的時候 會被紀錄
因此也在 history.pushState 可以使用之前,想要 ajax 不換頁,又有返回功能時,會利用#修改改網址,搭配JS撈網址判斷要回到哪一個頁面狀態
whien_liou (frontend-kaohsiung)
anchor tags 現在有些網站還是需要啊Q_Q
Sean Chen
@opjlmi
Mar 29 2016 03:43
maplenote (frontend-kaohsiung)
http://www.hyperlinkcode.com/bookmark.php 我覺得這真的是超老超老的用法XDDD
maplenote (frontend-kaohsiung)
現在都是用它的”附帶功能” 而不是用他原本的功能
opjlmi (nodejstw)
也可以搭配jquery做動畫效果
Sean Chen
@opjlmi
Mar 29 2016 03:54
maplenote (frontend-kaohsiung)
對耶~我忘記還有 Parallax Scrolling 也會用
Sean Chen
@opjlmi
Mar 29 2016 05:25
raphahsu (frontend-kaohsiung)
跟上面的preventDefault相關,這是預設行為
https://www.w3.org/MarkUp/1995-archive/Elements/A.html
一些transite animation則是透過停用預設行為,用animation fn overwrite達成
raphahsu (frontend-kaohsiung)
可以查一下this.hash這個keyword
Sean Chen
@opjlmi
Mar 29 2016 05:36
maplenote (frontend-kaohsiung)
樓上超專業!
Sean Chen
@opjlmi
Mar 29 2016 07:34
jacksonxu (frontend-kaohsiung)
http://www.slideshare.net/ccckmit/javascript-npm
Sean Chen
@opjlmi
Mar 29 2016 09:42
rayway30419 (frontend-kaohsiung)
我每次看陳老師的十分鐘系列都有為什麼不早幾年看到的感想QQ