文章

顯示從 3月, 2022 起發佈的文章

jQuery Mobile Data Attributes 有那些? (A)

圖片
 jQuery Mobile Data Attributes 有那些? (A) 小知識教學類型: 手機應用程式開發 jQuery Mobile Data 的 Attributes 給予了手機應用程開發員很多的選擇,除了方便易用增加程的的便利性,亦因為jQuery Mobile是採用HTML5 data-* attribute,所以亦大大強化了手機程式的容易使手度和外觀也有所提升。 Button: data-corners true | false 定義按鈕是否圓角顯示 data-icon Icons Reference 定義按鈕的圖標(原初設計是沒有圖) data-iconpos left | right | top | bottom | notext 定義按鈕的圖標位置 data-iconshadow true | false 定義按鈕的圖標是否帶有陰影效果 data-mini true | false 定義按鈕是否微細顯示 data-shadow true | false 定義按鈕是否帶有陰影效果 data-theme letter (a-z) 定義按鈕的主題色 Checkbox: data-mini true | false 定義Checkbox是否微細顯示 data-role none 防止jQuery Mobile把 checkboxes 當為 buttons data-theme letter (a-z) 定義Checkbox的主題色 Collapsible: data-collapsed true | false 定義內容是隱藏或是展開 data-collapsed-icon Icons Reference 定義Collapsible未展開時的圖標 (原初設定是+符號) data-content-theme letter (a-z) 定義內容的主題色 data-expanded-icon Icons Reference 定義Collapsible展開後的圖標 (原初設定是-符號) data-iconpos left | right | top...

進階JavaScript Array小教學例子

圖片
  進階JavaScript Array小教學例子 小知識教學類型: 網頁設計、網站製作 前文基礎篇,我們從基本的簡介和功能function介紹了JavaScript Array,今次我們嘗試更進一步,繼續由淺入深去了解JavaScript Array更多的用處,為網頁程式編寫員進補精華雞湯。 Array中的項目排序: Array.sort(): 把Array中的項目按英文字母順序排列 Array.reverse(): 把Array中的項目逆向倒轉排列 Array.sort(function(a, b){return a - b}): 把Array中的項目按數值由小至大排列 Array.sort(function(a, b){return b - a}): 把Array中的項目按數值由大至小排列 同樣的原理,若果Array項目是Object, 亦可透過 Array.sort(function(a, b){return a.Object - b.Object}); 來做sorting排序 Math.min.apply(null, Array): 找尋Array中最細的數值項目 Math.max.apply(null, Array): 找尋Array中最大的數值項目 Array的迴旋迴圈功能: Array.forEach(): 迴旋出Array中的每一個項目 Array.filter(): 把原先的Array在某條件式定義下建立出一個新Array Array.reduce(): 把原先的Array項目生成(縮減成)一個單一的值,由左至右行進 Array.reduceRight(): 把原先的Array項目生成(縮減成)一個單一的值,由右至左行進 Array.every(): 檢測Array中的每一個項目是否都能達成某條件要求 Array.some(): 檢測Array中的某些項目是否能達成某條件要求 Array.indexOf([Value]): 搜尋Array中的項目是否包含[Value],若果有,會回報第一次出現在Array中所在的位置 Array.lastIndexOf([Value]): 搜尋Array中的項目是否包...

Google Chrome 的 SEO 妙用技巧

圖片
 Google Chrome 的 SEO 妙用技巧 小知識教學類型: SEO搜尋引擎優化 當我們在努力於Google 的SEO搜尋排名表現時,其實Google自家出品的瀏覽器Browser Chrome 亦給予了很多SEO搜尋排名優化提升的幫助建議,工欲善其事,必先利其器,讓我們看看Google Chrome 的 SEO 妙用技巧: 首先,在Google Chrome 的Menu選單中,按更多工具可以查看到Google Chrome的一些額外功能。 Google Chrome 工作管理員: 可查看到頁面對你的電腦之記憶體使用量、CPU使用量和網絡使用量等等,這些都可以用作對比你自身和對手網站的電腦資源使用狀況,從而提升和優化自身網站的效能。網站的效能提升,會相當有助於SEO搜尋排名表現。 Google Chrome 開發人員工具: 這可以從網站的 Server 、網頁程式碼去檢測網站的運作狀況,例如 Elements (網頁原始碼,可看到網頁的各個生成元素), Network (網絡各元素的運載效能), Sources (網頁的使用資源), Timeline(網頁所發生事件的順序), Profiles, Resources (儲存資源的使用狀況), Audits (網站中有那些位需要修正) 和 Console (除錯控制) 等等,小編特別想大家專注於網站的速度,亦即網站中的圖片等資源運載速度和佔用的資源,網站的速度可以直接和間接地影響著SEO表現: 直接是速度的本身,間接是用戶的體驗差就會很快離開網站的頁面。 開發人員工具亦提供了一個模擬的設備和網絡環境選擇系統,讓網站程式編寫員可以模擬各式各類的設備和網絡環境去檢測網站的運作效能表現。模擬的設備是指桌上電腦還是不同類型的手機型號 (Apple or android)? 模擬的網絡環境是指 2G / 3G / 4G etc? 以上的 Google Chrome 工具,能助網頁程式設計員你更深入了解網站在瀏覽器的運載狀況從而作出優化和改善網站,因而可以改善SEO搜尋排名優化提升。而且 Google Chrome 不只是協助 html 的部份, css 和 jav...