React.js + <canvas> 我們有React，它可以幫助我們處理大量的可變DOM。 但想描述一種使用React的方法，它可以幫助您處理“<canvas>元素？是的，這聽起來很奇怪。但它運作得很好。 動機 使用了很多<canvas>元素。我製作了幾個使用<canvas>作為主要視圖組件的複雜應用程序。canvas對於復雜的應用程序製作上來說非常困難。所以開始使用canvas框架Konva 2d。...
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只是一個視圖庫，你可以隨意使用任何你喜歡的東西。然而，這並沒有多大幫助 -...
jQuery parent()應用層級元素的父親、阿公都來了
jQuery選取元素時，可以使用到parent()，選擇層級元素的上階層級，但往往需要在選取在上一階層，如父親的父親(阿公)，如範例<li>的爸爸<ul>，<ul>的爸爸<nav>，要對<nav>做些事情時，要如何處理？ 這時候其實很簡單，只要在相同的parent()之後再接續一個parent()，就能找到你要的元素層級，如下範例展示對<nav>插入一個Hello文字。 HTML text text text text jQuery $(function(){...
網頁動畫效果WOW.js+animate.css頁面滾動更有趣
Animate.css是個動畫CSS library，不過主要是專注在處理動畫的部分，並不負責在網頁上該什麼時機呈現動畫，加上WOW.js，如捲軸頁面在向下滾動的時候，有些元素會產生細小的動畫效果。雖然動畫比較小，但卻能吸引你的注意。如果你希望你的頁面也更加有趣，那麼你可以試試WOW.js。 WOW.js依賴animate.css，所以它支持animate.css多達60多種的動畫效果，能滿足您的各種需求。 瀏覽器兼容 IE6、IE7 等老舊瀏覽器不支持CSS3 動畫，所以沒有效果；而wow.js...
Javascript 取得遊覽器語系代碼
navigator 對像中的這幾個與 language 相關的屬性。 navigator 對象包含有關瀏覽器的信息。沒有應用於 navigator 對象的公開標準，不過所有瀏覽器都支持該對象。但是其內部一些屬性及其返回值在各瀏覽器並不統一。 language：返回當前的瀏覽器語言（來自 Mozilla Developer Center） userLanguage：返回操作系統設定的自然語言（來自 MSDN） browserLanguage：返回當前的瀏覽器語言（來自 MSDN）...
jQuery click按鈕開關開啟關閉區塊使用slideToggle
jQuery隱藏與顯示所要展現的區塊 在網頁上常使用按下指定的按鈕(或區塊)後，jQuery隱藏與顯示所要展現的區塊，此方法可以使用jQuery click slideToggle 簡單的實現。 HTML <a href="#" id="toggle-example2" class="button">開啟/關閉</a> <div class="example2"> <p>在網頁上常使用按下指定的按鈕(或區塊)後，隱藏與顯示所要展現的區塊，此方法可以使用jQuery click...
jQuery scroll 捲軸捲至側邊欄位到區塊高度後區塊固定在畫面-scroll fixed Div
jQuery捲軸滑動區塊的判斷，網頁上常看到應用在廣告區塊上，讓使用者在滑下遊覽器捲軸時，到此區塊廣告的高度的後，並能夠將畫面上的廣告區塊能夠在此時畫面固定住，然而離開這個卷軸高度廣告區塊又能夠還原在原來區塊不固定。 jQuery應用這個方式只需要得到在廣告區塊在遊覽器頁面上的位置高度 $(".div-w").offset().top，再來使用$(window).scroll(function ()得到捲軸高度事件，在做兩者的判斷就可以完成。 以下範例展示，可看到上圖右邊欄位廣告區塊，滑動捲軸顯示此效果：...