2019年12月8日 星期日

簡單的頁面拖曳/滑動(drag/swipe) js 套件- dragScroll.js

做網站有時候會遇到需要讓使用者可以透過拖曳的方式瀏覽的介面,如果單純用 scroll 的話橫向會有問題,手機的支援度也會有些問題,這時候我們就可以使用 dragScroll.js 這個外掛簡單幫我們處理這件事情。

外掛網址

讀入後簡單套用即可:
$('.drag').dragscroll();

也可以限制只能水平或垂直方向。
$('.drag').dragscroll({
  direction: 'scrollLeft'
});

$('.drag').dragscroll({
  direction: 'scrollTop'
});

Read more

2019年11月30日 星期六

2019年11月28日 星期四

2019年11月26日 星期二

淡海輕軌 x 幾米主題列車活動網站

淡海輕軌 x 幾米

最近在忙的專案上線了,這是淡海輕軌跟幾米主題列車的活動網站,主要只做手機版,但電腦版應該不至於壞掉只是相對簡單很多。

網站網址

點進去後可以看到介紹。
淡海輕軌 x 幾米

另外有一些輕軌的小知識。
淡海輕軌 x 幾米
淡海輕軌 x 幾米



輕軌那邊也有對各站做介紹,還有周邊可以去的景點推薦。
淡海輕軌 x 幾米
淡海輕軌 x 幾米


還有自動抓取 ig hashtag 的功能。
淡海輕軌 x 幾米


這個主要是有 AR 跟小遊戲,但因為這部分不是我做的,有興趣的朋友可以玩玩看。
淡海輕軌 x 幾米
Read more

2019年11月25日 星期一

升級 Mac 的 php 版本

Mac 本身內建有 php,如果想要升級版本的話就需要自己去下載並安裝,先用以下指令可以查看目前使用的 php 版本:
php --version

再來透過網路安裝新版的 php
curl -s http://php-osx.liip.ch/install.sh | bash -s 7.3

經過一段時間安裝後應該是安裝成功了,但查看版本可能還是舊版的 php,這時候再加上這段就好了:
export PATH=/usr/local/php5/bin:$PATH
Read more

2019年11月24日 星期日

2019年11月23日 星期六

2019年11月22日 星期五

Photoshop 的免費 UI 標示工具- Size-Marks-PS

現在雖然有不少好用的原型工具,像 Adobe XD 或 Sketch,但還是可能會收到一些不是用這些原型工具的檔案,如果是 photoshop 可以選擇這個免費的工具來幫忙標示 UI 的間距。

首先到 github 下載 Size-Marks-PS 這個 plugin

下載後依以下路徑安裝到 photoshop

OS X: /Applications/[Photoshop]/Presets/Scripts/
Windows: C:\[Program Files]\Adobe\[Photoshop]\Presets\Scripts


接下來重開 photoshop 就可以使用了,把要標示的距離用選取工具選起來。


接著從檔案 > 指令碼 選擇 Size Marks



這樣就會幫你標示了,如果覺得每次要從選單選很麻煩,也非常建議設定快速鍵,從 編輯 > 鍵盤快速鍵 > 檔案 > 指令碼 找到 Size Marks 就可以設定快速鍵。



這是開發者建議大家設定的快速鍵
OS X: Shift+Cmd+P
Windows: Shift+Ctrl+P

Read more

2019年11月21日 星期四

2019年11月20日 星期三

2019年11月19日 星期二

Related Posts Plugin for WordPress, Blogger...