Browse by Tags

閒聊:不想走在「最前端」, WebForm 開發者也該學的技能
就用這篇鬼故事當開場吧! 在 2016 年学 JavaScript 是一种什么样的体验? 這幾年 HTML5 火紅,前端開發技術發展如黃河氾濫一發不可收拾,開發框架百家齊嗚,眼花瞭亂不知如何下手就算了,更要命的是市場主流每兩年就轉一次風向,兩年前我才含淚從 Knockout 轉到 Angular ,現在卻眼看 React.js 及 Vue.js 可能把 Angular 的接班人 Angular 2 幹掉 Orz。不只開發框架主流變來變去,連開發工具也整套換光光。還記得兩年前的這篇 Gulp, Grunt...
ASP網頁IE9相容拉皮筆記
整合清代ASP 的工作持續進行,上回提過用IFrame內嵌ASP網頁時,父網頁與IFrame必須為同樣的IE模式,若父網頁要採HTML5時代寫法,就得考量各程式庫的IE最低版本要求,例如:KendoUI為 IE8以上 、AngularJS 1.3+ 需要IE9 ,再加上XML Data Island最後的支援版本為IE9、VBScript只到IE10,算下來IE9是基本要求。 初試幾個老ASP網頁切到IE9大致可行,但要改的小地方挺多,這篇先整理從IE5拉到IE9標準遇到的幾個CSS問題。 我把狀況整理成一個問題大全...
Posted 07 June 2016 10:30 PMJeffrey | with no comments 3,577
Filed under:
IE11、XML Data Island與VBScript
前文 提到眼前的棘手任務是在HTML5網站整合活化石等級的ASP(是的,就是ASP!不是ASPX),其中一大挑戰是ASP網頁裡大量使用XML Data Island與VBScript,能不能與HTML5並存是未知數,心中最理想結果是以IFrame內嵌ASP,大草原上羚羊跟迅猛龍一起快樂奔跑,世界真美好~當然,最後證明這只是不切實際的幻想,真實上演的是迅猛龍趕羚羊咬羚羊的慘烈場景 orz 試著在HTML5 IFrame內嵌實際的ASP,陸續發生詭異錯誤,為讓測試單純化,我簡化成用一個parent.html加一個embedded...
Posted 27 May 2016 08:08 AMJeffrey | 2 comment(s) 4,246
Filed under: ,
搞懂X-UA-Compatible IE相容設定
始終沒認真搞懂X-UA-Compatible IE=7跟IE=EmulateIE7有什麼不同,最近專案要步入「古今合壁」的偉大工程,把許多IE Only的活化石網頁跟HTML5網頁摻在一起做瀨尿牛丸,再不弄清楚恐會死得難看,於是查了文件做了實驗,筆記備忘。 MSDN文件 Defining document compatibility 所有IE包含三種文件模式: Standard Mode(標準模式) 努力支援最新HTLM5/CSS3/SVG等標準,但一如大家所知,不同版本IE支持程度不同 Quirks...
Posted 26 May 2016 06:37 AMJeffrey | 1 comment(s) 20,315
Filed under: ,
克服入口網站內嵌其他網站之跨網站存取限制
文章標題有點饒舌難懂,直接說我需求就清楚了。我想在員工入口網站(例如:portal.utopia.com)加入人事、行政、會計、電子表單等現成網站功能,這些應用程式各有自己的網站(例如:webap.utopia.com),最簡單的整合方法是在入口網站放個Iframe將其他網站的網頁內嵌進來,兩分鐘搞定,用膝蓋就能完成。 BUT,人生最機X的就是這個BUT! PM/老闆/使用者一定不會這麼簡單放過你,既然網頁已經整在一起,那麼切換樣式跟入口網站融為一體,審完表單入口網站的待審數字要減一,非常合情合理...
Posted 07 May 2016 03:00 PMJeffrey | 6 comment(s) 9,600
Filed under: ,
Chrome的Button Click行為差異
同事報案網頁在IE與Chrome表現不同,依稀記得遇過,但沒寫成沒找到明確記錄,花了時間回想、研究、實驗,得到結論後才恍然憶起,從HipChat對談翻出以前的辦案記錄。明明是前科犯還重啟調查,記憶力壞掉好可怕,也懊悔浪費了時間。由此得一結論-「勿以茶包小而不記,永遠別信任中年人的記憶力」,故寫此文。 用範例程式說明如下: Live Demo <! DOCTYPE html > < html > < head > < meta charset ="utf...
Posted 25 March 2016 07:21 AMJeffrey | with no comments 4,677
Filed under:
在IIS設定SVG與字型檔MIME Type
開始試用docfx產生API文件( docfx 是微軟程式庫文件產生器 SandCastle 的接班人),編譯專案時可一併產生API文件網頁,非常方便,大推!(docx的安裝使用可參考網友霧隱虎的 文章 ,VS2015用NuGet在專案安裝docfx.msbuild,以後每次編譯時可在_site目錄找到API文件網頁。) 直接從檔案總管瀏覽文件網頁大致正常,只有左側目錄總表因本機網頁JavaScript受跨網域存取限制無法顯示,將文件丟到IIS,目錄總表正常了,但出現另一個小問題,docfx的Logo...
Posted 17 February 2016 09:00 PMJeffrey | 2 comment(s) 8,513
Filed under: ,
從IE11的可笑UserAgent聊起
微軟在Windows Phone 8.1 Update裡幹了一件看似好笑的事,把Windows Phone的IE11 User Agent 改成 : Mozilla/5.0 (Mobile; Windows Phone 8.1; Android 4.0; ARM; Trident/7.0; Touch; rv:11.0; IEMobile/11.0; NOKIA; Lumia 930) like iPhone OS 7_0_3 Mac OS X AppleWebKit /537 (KHTML, like...
Posted 17 August 2014 11:00 PMJeffrey | 9 comment(s) 24,810
Filed under: ,
在IE8顯示SVG
除了Canvas,HTML5還提供另一種向量繪圖技術--SVG( Scalable Vector Graphics ),透過XML標籤定義矩形、圓弧、路徑(Path)、多邊形(Polygon)等向量模型,並可加上濾鏡、變形等特效,就能在網頁顯示可縮放的向量圖案。而SVG的XML元素如同HTML元素能透過JavaScript動態改變屬性、樣式,甚至用CSS :hover選取器就能做出滑鼠移過變色效果,例如: SVG與Canvas各有所長,適用場合不同,MSDN有篇詳細的 分析 可做為選擇評估的依據...
Posted 07 August 2014 10:28 PMJeffrey | 1 comment(s) 15,703
Filed under: , ,
HTML5 Canvas與幾何練習題-矩形邊框交點與線條箭頭
程式寫多了,什麼 死人骨頭都可能遇到 題材都有機會玩到。最近在寫電子表單流程圖模組,根本是在複習國中數學: sin、cos、兩點距離...  被幾何邏輯搞到昏頭,在草稿紙畫了一堆三角形示意圖還是似懂非懂 orz(數學老師站在我背後,他非常火) 其中有個需求: 用線條連接矩形中心與外部點,但線條需由矩形邊框開始畫起。換句話說,線條在矩形內部的部分隱形,只有與邊框交點到外部點間要畫線。原本已用一堆if else硬幹搞定,但想想還是該用幾何函數解決才會優雅。無奈數學天分不佳,只靠大腦模擬搞不出名堂...
Posted 07 August 2014 12:56 AMJeffrey | 4 comment(s) 7,212
Filed under:
透過JavaScript將HTML轉為圖檔
最近寫了小工具用ASP.NET MVC及Knockout讀取跑道計圈GPS資料轉成HTML表格,當成運動記錄的圖檔附件,但每次產生HTML表格後都得用螢幕擷取工具將網頁畫面另存圖檔,雖然手續還算單純,但你知道,懶惰是沒有極限的,我開始動腦筋,打算將產生圖檔的動作也自動化。 薑薑薑薑~ 如上圖所示,真的被我找到方法! 一切要感謝神奇的程式庫— html2canvas ,它可以將整張網頁或局部元素轉為HTML5 Canvas,一旦轉成Canvas,匯出圖檔便是 小事一椿 囉! html2canvas的原理並非擷取網頁畫素...
Posted 09 April 2014 10:41 PMJeffrey | 23 comment(s) 28,318
Filed under:
HTML表格欄寬分配實驗
接獲報案,某個KendoUI Grid網頁,調整瀏覽器顯示比例縮放後,最後一欄會莫名消失。 試著重現問題。如上圖所示,顯示比例100%時可以看到Column1到Column5共五欄,調整比例到125%,欄位放大,Gird下方出現捲軸,但向右捲動到底只見Column4,Column5不見了。除了調整顯示比例,改變視窗寬度也有同樣效果,只要寬度不足導致水平捲軸,Column5就會消失。 程式碼如下: [ Live Demo ] <! DOCTYPE html > < html >...
Posted 20 March 2014 09:43 PMJeffrey | with no comments 14,501
Filed under:
HTML5筆記–Object URL
相信大家對於 Data URI 已不陌生,這回再介紹另一個HTML5的好東西 --- Object URL。 Data URI的格式為="data:image/gif;base64,R0lGOD....",Object URL則是"blob:"再串上網址以及GUID,例如: blob:http%3A//www.darkthread.net/c94d498b-7818-49b3-8e79-d3959938ba0f 大家應該已經注意到一點明顯差異 -- Object...
Posted 12 March 2014 07:25 AMJeffrey | 7 comment(s) 29,337
Filed under:
HTML5上傳作業進度條-SignalR進階版
【前情提要】 利用File API與XHR2 onprogress事件,我們成功做出 檔案上傳進度條 。但我在工作上常遇到另一種情境 -- 內部系統的上傳轉檔作業。營運資料檔案一般不大,加上在Intranet裡傳輸,上傳只在彈指間,Server端解析資料、塞入資料庫才是重頭戲,常得耗上幾十秒到幾分鐘。這種狀況下,用XHR2做進度條的意義不大,咻! 一秒不到就從0%到100%,但上傳資料何時能處理完只有天知道? 使用者終究又陷入無法得知系統還在跑或者已經當掉的焦慮。我想起了"SignalR"...
HTML5檔案上傳進度條
在傳統網頁上傳大檔案,得等到全部傳完才會有回應,等待期間沒消沒息,搞不清楚是沒傳完還是當掉常為人詬病,也嚴重破壞使用者體驗。想在傳輸過程回報上傳進度,過去有些Flash、Java Applet或ActiveX的解決方案,但依賴外掛元件有部署及無法跨平台的疑慮。當HTML5規格漸成主流,長久以來的問題總算有了簡潔有效的解法。 要掌握上傳進度有一個關鍵: Client Script必須掌握檔案大小以及已上傳資料量,才可能計算上傳百分比回報狀態。傳統使用<input type="file">選取檔案配合<input...
更多文章 下一頁 »

搜尋

Go

<September 2017>
SunMonTueWedThuFriSat
272829303112
3456789
10111213141516
17181920212223
24252627282930
1234567
 
RSS
創用 CC 授權條款
【廣告】
twMVC
最新回應

Tags 分類檢視
關於作者

一個醉心技術又酷愛分享的Coding魔人,十年的IT職場生涯,寫過系統、管過專案, 也帶過團隊,最後還是無怨無悔地選擇了技術鑽研這條路,近年來則以做一個"有為的中年人"自許。

文章典藏
其他功能

這個部落格


Syndication