MAC OSX更新Yosemite之後,調整音量的「啵啵啵」聲音不見了!


MAC OSX更新Yosemite之後,調整音量的「啵啵啵」聲音不見了!

這樣調音量就不知道現在多大聲了啊⋯⋯
好在有開啟方法!

系統偏好設定/聲音/音效,將「當音量變更時播放回饋音」打開,才會有聲音~
(預設把勾勾拿掉了)

不過聲音變成「哆哆哆」了⋯⋯
Read More...

在面試時告訴企業主「不加班」是錯的嗎?談里程碑設置法

我是一個工作三年剛邁入第四年的人,今年我不小心進到一家「要加班的公司」。
所以我積極想逃走,而且我會說明不喜歡加班(找死?XD)


我認為加班最大的原因是「設置了錯的里程碑」。


舉例來說,一個活動網頁要上線,一開始擬定上線日期如果是一星期後必須上線,那麼該員工原本負責的工作呢?如果該員工本來被安排的工作量都已經要稍微加班才能完成,那新加入的活動網頁肯定會讓該員工的工時加長。


如果無法吃下那麼多工作量,為何要緊逼員工的「下班後產能」呢?


我理想中的里程碑設置法:

  1. 先粗估完成日期
  2. 將粗估的完成日期當作查核點
  3. 將完成日期設為查核點後一星期,作為突發狀況調整、除錯之用
  4. 設定提前完成獎勵(我偏好用特休而非獎金獎勵)
  5. 若完成日期有難度,請該專案負責人在完成日期之前就要提出說明及預定完成日




如此一來,超過完成日期又沒有說明或尋求幫助的話表示能力不佳;但在完成日期之前完成的話,員工士氣高昂,專案又順利進行,和樂融融。







不過我只是個小小網頁前端,雖然當過小小公司的網站專案經理,但要走到管理這步還早還早⋯⋯
Read More...

Steve Jobs在Standford大學的演講文字稿

只要你是Mac電腦,在Finder中同時按下Command + Shift + G,就會出現「前往檔案夾」的對話框,貼上以下路徑:
/Applications/Pages.app/Contents/Resources/
就會找到Apple.txt,裡面的文章是Steve Jobs在Standford大學的演講文字稿,全文如下:

Read More...

[筆記] 在Mac安裝Compass


雖然據說在Mac下安裝Compass只要打開終端機貼上指令就好,但我的電腦不知道為甚麼全部都要加上sudo才能裝⋯⋯以下記錄步驟,如果不會卡住的話就自己拿掉sudo吧ˊ_>ˋ

Read More...

安裝Compass遇到的的錯誤「 ERROR: While executing gem ... (Gem::FilePermissionError) 」解決方法


最近在裝Compass時遇到了這個錯誤:
ERROR:  While executing gem ... (Gem::FilePermissionError)
    You don't have write permissions for the /Library/Ruby/Gems/2.0.0 directory.

Read More...

選字的時機——臺灣vs.台灣

直立招牌


這次是因為被要求,我才用了右邊的「台灣」作為最後定稿。


其實我一直是個捍衛正體中文字的有志青年(?)
我不僅寫「臺灣」,還寫「新臺幣」、「臺東」、「臺北」、「臺中」、「臺南」,對我來說本來就該寫「臺」,所以看到任何寫「台」的都覺得可惜:




不過,相比之下也可以發現保留「臺」這個字的單位越來越少:





台灣的漢字正式書寫為「臺灣」,而「」為正體字,但與異體字」通用,現今民間與媒體多用「灣」[23],在官方國書、文件中則使用正式的「灣」[24]臺北市政府馬英九擔任市長推動「正體字運動」時,全面於相關機關的公文與文件使用「」字[25]中華民國教育部在2010年考據字源後宣布,以後教育部公文一律使用「臺灣」用字,並建議中央其他部會跟進[26]。而俗體字」的發音實為「 yi 」,意思和「怡」字通用[27]
中文維基百科
 


不過像我這次做招牌的時候,對方的理由我倒也覺得很有道理:

「寫『台』灣,看的人才能一下子看出台灣啊!要是寫臺灣的話,臺都糊在一起了!」

模擬一下:從很遠的地方看臺灣與台灣會如何⋯⋯


好吧,我被說服了。

既然臺灣台灣大家都看得懂,那用在招牌或一些宣傳場合,台灣好像真的比較容易辨識?甚至日本人寫臺灣漢字時也是寫「台湾」,「台湾大哥大」就是用日文漢字⋯⋯

看來「臺」與「台」的戰鬥將繼續下去⋯⋯XD
Read More...

我把Facebook留言板變活了!Facebook Comment Responsive Design!


最近在做Responsive Design(響應式設計、自適應設計)的網站時,意外發現Facebook的留言板無法用%來設寬度,只能用pixel固定寬度。

雖然Facebook的留言板預設在手機上會把寬度變成100%,但其實有的時候會出現不是在手機上用,卻想把網頁縮小一點點的情況,例如上班偷看網頁所以我很不懂為甚麼Facebook要強制用px?

我用「facebook comment responsive」的關鍵字在Google上查了很多資料後,本來有看到用CSS強制覆蓋Facebook提供的屬性來讓留言框可以變成Responsive的狀態,但有用的人應該會發現已經在2014年3月失效了⋯⋯

為甚麼我知道是2014年3月呢?因為後來我又繼續爬,發現了一個頗簡單的解法!而提問的人大多是在3月發生的XD

Read More...

浮動側欄動態選單簡易教學



最近趁過年時,幫綜合口味的關於頁面做了「浮動側欄動態選單」,如果想看效果的話可以先去綜合口味的關於頁面玩玩看~喜歡的話再來照這個教學做XD



step1:

將想要有「浮動側欄動態選單」的網頁或文章,從「撰寫」模式(預設)切換到「HTML」模式,並在文章最前方貼入以下內容:

<!--浮動右側欄位Start-->

 <!--part1Start-->
<style>
.floatMenu{
 width:110px; //如果每個區塊的字數較多,請自行調大這裡的數值。
 margin-left:672px; //如果沒有剛好吸附在右邊的話,請自行調整這裡的數值,數字越大越右邊。(想吸附在左邊的話請見附註4)
 position:fixed;
 top:20%; //如果想要更改出現的高度的話,請自行調整這裡的數值,數字越大越下面。
}

 .pointer {
 //這段之下是讓效果變柔和的效果,可自行修改「.25」的數值調整速度,若不需要可拿掉XD  
 -webkit-transition:all .25s ease-in-out; -moz-transition:all .25s ease-in-out; 
-o-transition:all .25s ease-in-out; transition:all .25s ease-in-out;
 //這段之上是讓效果變柔和的效果,可自行修改「.25」的數值調整速度,若不需要可拿掉XD 
 
 background-color:#fff; //每個項目的顏色。
 text-indent:0;
 display:inline-block;
 font-size:1em; //項目的字體大小,若單位不習慣em可自行改為px。
 font-style:normal;
 height:40px; //每個項目的高度。
 line-height:40px; //行高,請跟項目的高度一樣。
 width:100px; //每個項目的寬度。
 text-decoration:none;
 text-align:center;
 margin-bottom:5px//每個項目的間距。
 border-left: #31BBBB 10px solid; //每個項目前面的那條顏色及寬度,想換色就修改#的內容,改粗細則修改10px這數值。
}

 .pointer:hover{
 border-left: #f64c83 5px solid; //滑鼠經過時,每個項目前面的那條顏色及寬度;想換色就修改#的內容,改粗細則修改5px這個數值。由於滑鼠經過時會從10px變成5px,所以會產生動態效果,若只想單純換色就將數值改為10px即可。
}
</style>
<!--part1End, made by chodaict-->

 <!--part2Start-->
<script>
$(function(){
 $('#aboutA').click(function(){ $('html,body').animate({scrollTop:$('#about').offset().top}, 800); }); //這邊注意,一個是「aboutA」,另一個是「about」,可自行命名。
 $('#nameA').click(function(){ $('html,body').animate({scrollTop:$('#name').offset().top}, 800); }); //這邊注意,一個是「nameA」,另一個是「name」,可自行命名。
 $('#authorA').click(function(){ $('html,body').animate({scrollTop:$('#author').offset().top}, 800); }); //這邊注意,一個是「authorA」,另一個是「author」,可自行命名。
});
</script>
<div class="floatMenu">
<a class="pointer" href="#about" id="aboutA"> 關於我們</a><!--這邊id要有A,href則不必。-->
<a class="pointer" href="#name" id="nameA">  名稱由來</a><!--這邊id要有A,href則不必。-->
<a class="pointer" href="#author" id="authorA">作者簡介</a><!--這邊id要有A,href則不。必-->

</div>
<!--part2End, made by chodaict-->

 <!--浮動右側欄位End, made by chodaict-->





step2:

接下來,一樣在Html模式,把文章的段落用div標籤分隔開來:
<div id="about">
區塊文章內容,文章寫在這區域內!
</div>

 <div id="name">
區塊文章內容,文章寫在這區域內!
</div>

 <div id="author">
區塊文章內容,文章寫在這區域內!
</div>
⋯⋯依此類推。如此一來,就擁有跟綜合口味的關於頁面一樣的浮動側欄動態選單了!







附註:

  1. 樣式歡迎自行修改!
  2. 在step1中橘色字的部分,如果會在很多頁面用到的話,可以考慮直接貼到範本的程式碼內,到搜尋</head>並貼在前一行。
  3. 在step1及step2中引號內的aboutaboutA皆可以自行修改,但要注意名字要一樣,例如改成hellohelloA是沒問題的,否則會沒有效果。
  4. 如果希望浮動欄改到左邊的話,把margin-left:672px;這段改成margin-right:672px;然後數值自己設定,數值越大就變成越右邊!
Read More...

給blogger用的語音搜尋框

這個搜尋框在chrome可以用語音搜尋,

效果可參考綜合口味的搜尋區~開放給需要的人使用:)

以下直接複製並貼到html/javascript小工具即可,如果想放在除了側邊欄以外的地方就請自行去範本小工具內貼囉!


複製開始!

<!--madeBy-chodaict-->

<div id='searchBar'>
<style>
#search-box {
position: relative;
margin: 0;
padding: 0;
float:right;
}


#search-form{
width: 220px;
height: 30px;
border: 1px solid #ccc;
background-color: #fff;
overflow: hidden;
margin: 0 70px 0 0;

-webkit-border-radius: 30px 0 0 30px; //搜尋框的圓角,四個數字分別是左上、右上、右下、左下
-moz-border-radius: 30px 0 0 30px; //搜尋框的圓角,四個數字分別是左上、右上、右下、左下
border-radius: 30px 0 0 30px; //搜尋框的圓角,四個數字分別是左上、右上、右下、左下
}

#search-text{
font-size: 14px;
color: #ccc;
border-width: 0;
background: transparent;
}


#search-box input[type=&quot;text&quot;]{
width: 90%;
padding: 10px 0 10px 1.5em;
color: #333;
outline: none;
}


#search-button {
position: absolute;
top: 0;
right: 0;
height: 32px;
width: 70px;
font-size: 26px;
color: #fff; //搜尋符號的顏色
text-align: center;

-webkit-border-radius: 0 30px 30px 0; //搜尋按鈕的圓角,四個數字分別是左上、右上、右下、左下
-moz-border-radius: 0 30px 30px 0 ; //搜尋按鈕的圓角,四個數字分別是左上、右上、右下、左下
border-radius: 0 30px 30px 0 ; //搜尋按鈕的圓角,四個數字分別是左上、右上、右下、左下

border-width: 0;
background-color: #666;//搜尋按鈕的顏色
cursor: pointer;

-webkit-transform: scaley(-1);
-moz-transform: scaley(-1);
-o-transform: scaley(-1);
transform: scaley(-1);

line-height: 0px;
}

#search-button:hover{
background: #999; //滑鼠經過搜尋按鈕時的顏色
}

</style>

<div id='search-box'>
<form action='/search' id='search-form' method='get' target='_top'>
<input id='search-text' name='q' placeholder='想找點什麼嗎?'
size='30' type='text'
x-webkit-speech='true' //這個就是語音功能!
/>
<button id='search-button' type='submit' value='Google Search'><span>&#9740;</span></button>
</form>
</div></div>
<!--madeBy-chodaict-->

複製結束!


如果想調整的話請自便~XD
Read More...

如何在Mac OS X 10.9 開啓Root權限?步驟截圖!

由於Apple官方的步驟流程不夠詳盡,想當初我也研究了很久才看懂;
這次剛好有網友詢問,就來幫Apple整理一下截圖吧XD!



  1. 從 Apple 選單中選擇系統偏好設定...。
  2. 從顯示方式選單中選擇使用者與群組。
  3. 按一下鎖頭圖案,以管理者帳號的身分進行認證。
  4. 按一下「登入選項...」。
  5. 按一下右下方的「編輯...」或「加入...」按鈕。
  6. 按一下「打開目錄工具程式...」按鈕。

  7. 按一下「目錄工具程式」視窗中的鎖頭。
  8. 輸入管理者帳號名稱和密碼,然後按一下修改設定
  9. 從編輯選單中選擇啟用 Root 使用者。
  10. 輸入您要在「密碼」與「驗證」欄位中使用的 Root 密碼,然後按一下「好」。
  11. 接下來重新開機就會看到一個叫做「其他」的使用者!
  12. 點擊後,帳號輸入root,密碼就打剛才輸入過並驗證的密碼。
  13. 成功以root身份進入!
  14. 若要停用root,請從步驟1走到步驟8,選停用root即可!

以上步驟截圖完畢!希望能幫助到一樣困惑的使用者囉!
Read More...