rplus.github.io
rplus.github.io copied to clipboard
Rplus
my blog~
相對於製作一條新的團圓 IF 線 個人更欣賞這次《夢回仙劍》的劇情編排 會特地來回味仙劍一的族群大多已成年 也都多少學會了些處世經歷 而有些事遇到了，當然有各種方法去推拖閃躲飄 但，總是有那麽些時候 得硬著頭皮去面對、去接受、去妥協 討厭的事如此，悲傷的事亦如此 人生，如此 這次的主角是李逍遙 真正活在現實的也只有李逍遙 這段美好卻無法流連的旅程 也正是他跨過悲傷、重拾自我的一段療程 ---- 在那叫天天不應的巨大悲慟衝擊後 迫使了他封閉了過往記憶 以此來否認天人永隔的殘酷現實 一開始可以看到失憶的李逍遙少年開朗、有著大俠抱負 也會為了旁人受欺伍而主動跳出來幫忙 性情依然如此活潑、也自戀如昔 但在記憶慢慢回復後 他就開始變得畏手畏腳的 想乞求、想希望，憾事不會再次發生 曾經無力逆天而行的沮喪 想必也隨著記憶復甦而鋪天蓋地般再次掩來  但，所幸 兩位女主角都是這麽的美好...
前些天抽空參考 Codrops Collective 的封面做了個 CSS 動畫版的 要看錄的示範影片請到 [Twitter](https://twitter.com/RplusTW/status/1122217782685224961) Codrops [原圖](https://twitter.com/codrops/status/1107666194935492609)：  因為最近寫 code 都沒在錄影 而且這玩意算數學也稍微花了一些時間 錄起來應該會像停格一樣吧 XD 下面回憶/記錄一下自己的製作思路： ## 1 基板 看到圖形時 就大概有個概念弄個一堆點點 然後配上不同的 `scale` 數值，讓它們有不同的尺寸 主要的思考是在於需不需要使用 CSS Grid 因為其實主要圖案的排版也不難...
因為 FB 寫了篇英翻中的介紹文， https://www.facebook.com/photo.php?fbid=1118960684838380 就順便來整理一下自己在使用的中英對照翻譯流程 > PS: > 這主要是為了練習英文，並不是為了要看中文 > 我自己看英文是比較需要跟著讀才有辦法閱讀快些 XDD > 所以利用這個中英對照的技巧，我可以加速理解文章所表達的概要，再視情況看英文細讀 我用的是 Chrome，也只會講 Chrome， 接下來以這篇文章為例： Let’s Write Beautiful CSS Comments http://seesparkbox.com/foundry/lets_write_beautiful_css_comments 會先講講思路順序， 再來談談怎麼自動套用~ ## 1. 瀏覽器內建翻譯 ...
 ## 0. 前言 這是上週六(12/25) [網友線下聚會](https://www.facebook.com/100001733786295/posts/1309382185796228)(?) 時，我所負責撰寫的 UI 部份 這次玩得挺開心的， 不論是大家拼命調整開發環境、或是對細節精雕細磨都超有趣的 XD 不過更棒的是， 最後大家在分享時都非常熱心地介紹自己使用的技巧，也都樂於提出建議～ 希望下次還可以繼續一起約出來玩～ 至於我負責的畫面可以先看看實作完的 demo: Pokédex in CSS grid [[[pen slug-hash='MbddMe' height='300' embed-version='2']]] ps: 這篇效果應用了些許新的 CSS 規格，不保證所有瀏覽器皆正常顯示...
分兩種 一種是 `div` 另一種是 `input` & `textarea` ref: https://stackoverflow.com/a/2897510 ## `input` 的 https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement `input.selectionStart` 是 caret 的位置 若是一般的 caret 位移(非選取模式)，則該值會與 `input.selectionEnd` 相同 所以若是要取代 caret 左邊字元的話，就： ```js let index = input.selectionStart;...
## 1. 螢幕分享式的視訊直播 這應該是最近很常見到的 live coding 方式 平台有 Facebook, [YouTube](https://www.youtube.com/live_dashboard), …etc 分享範圍也有分全部桌面或是單一程式 因為有的主播習慣直接在線上 IDE 直接 coding 有的喜歡開自己慣用編輯器 > 只是要盡量能平鋪會用到的視窗，少狂切換放到全滿的視窗，不然觀眾會比較不好跟上 > 另外開全桌面的，就要留意一下中途會不會被其它軟體的通知干擾 XDD 螢幕分享有個不小的限制就是網路傳輸速度要夠 不管是主播或是觀眾， 所以有時網路較差時會容易 lag 或是畫質變差看不清 code 若擔心 code...
--- layout: post title: Time format tagline: 瞧瞧各大網站對時間標記的寫法 category : tech ## tags : [html, sematic, time] {% include JB/setup %} - 大多數的原始時間都是 unix 輸出的 10 位數 timestamp - instagram...
Typography Handbook by Kenneth Wang http://typographyhandbook.com/ > A concise, referential guide on best web typographic practices. > github repo: https://github.com/kennethwang14/TypographyHandbook 這一份排版指南主要分三大部份及其下各小分節 介紹詳細，且參考資源眾多 - Typographic Design - Fonts - Web Style...
Understanding The CSS Property Value Syntax By Russ Weakley 2016-05-20 https://www.smashingmagazine.com/2016/05/understanding-the-css-property-value-syntax/ Component Values - keyword values ``` = | thin | medium | thick ``` - basic data types ```...
這篇要聊的主題是網路檔案傳輸的耗時， 以及如何用較生活化的方式來理解/記憶 通常， 網頁中傳輸檔案(assets) 若能讓使用者愈快拿到是愈好 就像肚子餓訂披薩當然會希望愈早吃到愈好 --- === 所以，接下來會用外送披薩來作比喻 === - 披薩店：server - 顧客：client - 披薩：assets --- 使用者希望的是「等著吃披薩的時間要短」 那就得先來看看有哪些變因會影響「時間」 我們知道物理學中計算速率的方式就是距離除以耗時： ``` V(elocity) = D(istance) / T(ime) ``` 那換言之， 耗時就等於距離除以速率：`T =...