PHP IntelliSense是一個能夠提供快速完成PHP代碼及查找關聯、精確錯誤報告的智能感知PHP擴展。在使用VScode安裝PHP IntelliSense開發PHP需要先安裝PHP7才能使用，也就是說需要有架設好的PHP環境。 Visual Studio Code + XAMPP 這邊選擇最快速架設一個WebServer，使用XAMPP(Apache + PHP + Mysql等等...)，提醒要裝PHP7的版本。 XAMPP安裝完成後，開啟XAMPP Control...
設定Visual Studio Code Python 開發環境建置作業
Python的擴充功能 只要你用Visual Studio Code打開一個Python.py檔案，VSCode都會貼心的提示你要進行安裝Python的擴充功能(如下圖所示)。 當然安裝完成擴充功能，還需要寫完程式時的建置作業，總不能在每次寫完一行程式就用cmd的方式去run你的結果吧! VSCode Python建置作業 當然VSCode也提供了完善的建置作業。只需要簡單的設定，之後就需要使用快捷鍵或按鈕就可以完成。 選單工作列上選擇 工作 > 工作設定 ，如下開啟一個tasks.json檔案。 tasks.json...
Storyboarder發揮你的創意免費分鏡故事板軟體
Storyboarder想像您的故事的最佳方式 Storyboarder可以讓你很容易地直觀地看到一個故事，你可以繪製簡單的數字。快速繪製以測試故事構思是否有效。創建並向他人展示動畫。在不拍電影的情況下表達你的故事點子。 實際上，Storyboarder是一個已經發布免費和開放源代碼，你可以甚至做出改進，讓Storyboarder成為最好的故事板工具。 快速和簡單 Storyboarder的設計很簡單。包含了您需要的工具，並刪除了您不需要的所有內容。 6個簡單的繪圖工具...
CSS3 :target 選擇器做出onClick效果純CSS的lightbox
CSS3 :target 選擇器 定義和用法 URL 後面帶有錨名稱#(錨點)，指向文檔內某個具體的元素。這個被鏈接的元素就是目標元素(target element)。 :target 選擇器可用於選取當前活動的目標元素。 :target CSS 代表一個唯一的元素（目標元件用）id匹配的URL的片段。 / *選擇一個ID與當前URL片段匹配的元素* / ：target { border ： 2px solid black ; } 例如，下面的URL有一個片段（用＃符號表示）指向一個名為section2：...
5個最好的Javascript Ajax庫，用於在前端API AJAX調用
5個最好的庫，用於在React中進行AJAX調用 以下React為例，如其他javascript框架與庫也是適用於其中，如vue.js。 在過去的兩年裡一直和React合作。許多React初學者提出的問題之一是：“從服務器獲取數據的React方式是什麼？”或“我應該如何在React中進行AJAX調用”？要回答你的問題，盡可能多的開發者會告訴你，React只是一個視圖庫，你可以隨意使用任何你喜歡的東西。然而，這並沒有多大幫助 -...
Procreate 繪圖大師APP教學 iPad Pro + Apple Pencil
《Procreate》比之於其他繪圖軟體出色的地方之一就是豐富且強大的筆刷工具，搭配Apple Pencil可說上是ipad pro創作的最佳的工具，有畫筆和手指塗抹兩種作畫方式，墨水、馬克筆、繪畫筆、圖形等不同的筆刷工具可選。 Procreate影片操作教學 影片內容展示如何操作使用Procreate繪圖軟體，有些小細節的操作，如上色使用顏色拖曳直接上色，與複製的方法使用套選後三隻手指如何操作，與快速的合併圖層方式。(影片內都有展示) Procreate影片操作基本應用複製、上色、貼上...
jQuery parent()應用層級元素的父親、阿公都來了
jQuery選取元素時，可以使用到parent()，選擇層級元素的上階層級，但往往需要在選取在上一階層，如父親的父親(阿公)，如範例<li>的爸爸<ul>，<ul>的爸爸<nav>，要對<nav>做些事情時，要如何處理？ 這時候其實很簡單，只要在相同的parent()之後再接續一個parent()，就能找到你要的元素層級，如下範例展示對<nav>插入一個Hello文字。 HTML text text text text jQuery $(function(){...
flexbox CSS menu RWD簡單實現方式
HTML text text text text css ul{ list-style-type: none; margin: 0; padding: 0; text-align: center; } ul li{ background-color: gray; padding: 10px; } ul li:hover{ background-color: rgb(138, 138, 138); } @media screen and (min-width:768px) { ul{ display: flex; } ul li{...
網頁動畫效果WOW.js+animate.css頁面滾動更有趣
Animate.css是個動畫CSS library，不過主要是專注在處理動畫的部分，並不負責在網頁上該什麼時機呈現動畫，加上WOW.js，如捲軸頁面在向下滾動的時候，有些元素會產生細小的動畫效果。雖然動畫比較小，但卻能吸引你的注意。如果你希望你的頁面也更加有趣，那麼你可以試試WOW.js。 WOW.js依賴animate.css，所以它支持animate.css多達60多種的動畫效果，能滿足您的各種需求。 瀏覽器兼容 IE6、IE7 等老舊瀏覽器不支持CSS3 動畫，所以沒有效果；而wow.js...