範例如下:
主要的關鍵是 dataTransfer 這個屬性的使用 , 這範例也是從書上改寫而來的, 給大家見笑參考看看啦~
2013年11月17日 星期日
Posted by 小洪
Posted on 晚上10:48
with No comments
主要的關鍵是 dataTransfer 這個屬性的使用 , 這範例也是從書上改寫而來的, 給大家見笑參考看看啦~
2013年11月15日 星期五
Posted by 小洪
Posted on 中午12:50
with No comments
這兩個方法讓 AJAX 技術又多了一些新的進階應用。
AJAX 的無刷新頁面更動頁面內容是不錯, jQuery的出現後我想一般人都可以輕鬆無壓力的使用， 但是這種作法對於 "上一頁" 和 "下一頁" 的功能 以及 SEO 並不友善 , 然而 HTML5 history API 的 pushState( ) 和 replaceState( ) 這兩種方法可以有效解決上述問題 , ( SEO老實說不確定 ) , 以下是範例程式碼:
大家在開啟範例後，應該可以發現兩個方法其實大同小異。
唯一區別是 pushState( ) 會 "新增" 一個歷史實體 ( history entry ), 而 replaceState( ) 則是 "更新" 目前的歷史實體, 我們可以看情況決定如何應用 。
當然 ， 這個範例僅只是讓大家體會一下這兩個方法的基本操作, 要像 GitHub 和 Facebook 如變魔術般的調換頁面還需要輔以各種動畫特效及透過 AJAX 與後端程式做搭配 ，有機會的話也許會在下個案子中實際套用看看吧~
AJAX 的無刷新頁面更動頁面內容是不錯, jQuery的出現後我想一般人都可以輕鬆無壓力的使用， 但是這種作法對於 "上一頁" 和 "下一頁" 的功能 以及 SEO 並不友善 , 然而 HTML5 history API 的 pushState( ) 和 replaceState( ) 這兩種方法可以有效解決上述問題 , ( SEO老實說不確定 ) , 以下是範例程式碼:
prState.html
music.html ( 這邊當然只是因為示範才這們作, 實際情況的設計當然不是如此 )
大家在開啟範例後，應該可以發現兩個方法其實大同小異。
唯一區別是 pushState( ) 會 "新增" 一個歷史實體 ( history entry ), 而 replaceState( ) 則是 "更新" 目前的歷史實體, 我們可以看情況決定如何應用 。
當然 ， 這個範例僅只是讓大家體會一下這兩個方法的基本操作, 要像 GitHub 和 Facebook 如變魔術般的調換頁面還需要輔以各種動畫特效及透過 AJAX 與後端程式做搭配 ，有機會的話也許會在下個案子中實際套用看看吧~
2013年11月11日 星期一
2013年11月4日 星期一
Posted by 小洪
Posted on 凌晨1:10
with No comments
javascript:document.body.contentEditable = 'true'; document.designMode='on'; void 0
2013年9月30日 星期一
訂閱：
文章 (Atom)