日韩无码专区无码一级三级片|91人人爱网站中日韩无码电影|厨房大战丰满熟妇|AV高清无码在线免费观看|另类AV日韩少妇熟女|中文日本大黄一级黄色片|色情在线视频免费|亚洲成人特黄a片|黄片wwwav色图欧美|欧亚乱色一区二区三区

RELATEED CONSULTING
相關(guān)咨詢
選擇下列產(chǎn)品馬上在線溝通
服務(wù)時(shí)間:8:30-17:00
你可能遇到了下面的問(wèn)題
關(guān)閉右側(cè)工具欄

新聞中心

這里有您想知道的互聯(lián)網(wǎng)營(yíng)銷解決方案
HTML5如何實(shí)現(xiàn)緩沖效果

HTML5在移動(dòng)設(shè)備上表現(xiàn),相信已經(jīng)不用我多說(shuō)了,干掉了Flash之后,它已經(jīng)坐上了移動(dòng)應(yīng)用程序的***把交椅。幾乎所有稍微高端一點(diǎn)的設(shè)備(喬幫主的iPad,iPhone和Andriod的平板手機(jī)等)的瀏覽器都支持HTML5,而且據(jù)權(quán)威人士測(cè)試,這些支持HTML5的設(shè)備對(duì)Canvas標(biāo)簽的支持也是相當(dāng)?shù)暮谩?/p>

大家都知道Web2.0以來(lái),應(yīng)用程序的實(shí)現(xiàn)使用了大量Ajax,而Loading的小圖標(biāo)也有很多,甚至還有專門提供Loading圖片的網(wǎng)站,所以我就想能不能讓HTML5一并解決這個(gè)以前用gif文件才能解決的問(wèn)題。出乎我意料的是,實(shí)現(xiàn)的過(guò)程非常簡(jiǎn)單,只用了不到一小時(shí)的時(shí)間我就用HTML5實(shí)驗(yàn)出了兩個(gè)Loading效果,而且這樣做出來(lái)的Loading圖標(biāo)是可定制的,既可以定制顏色,也可以定制大小等屬性。

***個(gè)帶著小尾巴轉(zhuǎn)動(dòng)的loading圖標(biāo)畫(huà)圖的思路是,首先畫(huà)一個(gè)圓,然后在圓的邊上按順序畫(huà)大小逐漸減小的小圓點(diǎn),在每次刷新畫(huà)布時(shí)改變這一系列的小圓點(diǎn)在大圓邊上的位置。

這里是案例的演示代碼:

 
 
 
  1.  
  2.  
  3.    
  4.     
  5.    loading 
  6.     
  7.    
  8.    
  9.      
  10.     

     

  11.      
  12.      
  13.  
  14.     

     

  15.      
  16.    
  17.  

演示地址:http://f200-8.bbs.hexun.com/e/111219/loading.htm

第二個(gè)較為簡(jiǎn)單,在一個(gè)圓環(huán)上有一個(gè)相同圓心相同半徑的圓弧在不停的轉(zhuǎn)動(dòng)。畫(huà)圖的步驟是首先畫(huà)一個(gè)圓環(huán),然后畫(huà)一個(gè)不同顏色相同圓心半徑的圓弧,在每次刷新畫(huà)布時(shí)改變圓弧的起始角度。

這里是案例的演示代碼:

 
 
 
  1.  
  2.  
  3.  
  4.    
  5.   loading 
  6.    
  7.    
  8.    
  9.     您的瀏覽器不支持html5喲 
  10.     

     

  11.      
  12.      
  13.     

     
  14.      
  15.    
  16.  

演示地址:http://f200-8.bbs.hexun.com/e/111219/loading2.htm

目前從移動(dòng)設(shè)備對(duì)HTML5的支持來(lái)看,HTML5將來(lái)必定大有可為。

天下大勢(shì),合久必分,分久必和。PC開(kāi)發(fā)時(shí)Web應(yīng)用在很大程度上統(tǒng)一了客戶端程序;而現(xiàn)在移動(dòng)開(kāi)發(fā)使用不同的系統(tǒng)不同的語(yǔ)言,將來(lái)大多數(shù)應(yīng)用必然會(huì)統(tǒng)一到一種語(yǔ)言,這種語(yǔ)言必然是html5加Javascript。

注意:由于目前支持HTML5的瀏覽器還不是很多,請(qǐng)各位在查看演示案例的時(shí)候使用Firefox10或者Oprea11等高版本瀏覽器。

原文地址:http://www.52maomao.info/html5-loading.html


網(wǎng)頁(yè)標(biāo)題:HTML5如何實(shí)現(xiàn)緩沖效果
新聞來(lái)源:http://m.5511xx.com/article/dhdpsje.html