首頁>網頁設計教程> HTML教程
全部 Dreamweaver教程 Javascript教程 HTML教程 CSS教程 心得技巧 DHTML教程 網頁特效 WEB標準化
HTML教程
  • 基於HTML5 Canvas實現的互動式地鐵線路圖

    基於HTML5 Canvas實現的互動式地鐵線路圖

    前言前兩天在echarts 上尋找靈感的時候，看到了很多有關地圖類似的例子，地圖定位等等，但是好像就是沒有地鐵線路圖，就自己花了一些時間搗鼓出來了這個交互式地鐵線路圖的Demo，地鐵線路上的點是在網上隨便下載了一個，這篇文章記錄自己的一
    2025-01-24
  • 使用express建構一個簡單的查詢伺服器的方法

    使用express建構一個簡單的查詢伺服器的方法

    本文介紹了使用express搭建一個簡單的查詢伺服器的方法，分享給大家，具體如下：使用到的技術堆疊有express、mysql.專案架構:service--node_modules--app.js--query.jsapp.js支援呼叫服務,
    2025-01-24
  • 使用html2canvas.js實作頁面截圖並顯示或上傳的範例程式碼

    使用html2canvas.js實作頁面截圖並顯示或上傳的範例程式碼

    最近寫專案有用到html2canvas.js，可以實現頁面的截圖功能，但遭遇了許多的坑，特此寫一篇隨筆記錄一下。使用html2canvas時可能會遇到諸如只能截取視覺化介面、截圖沒有背景色、svg標籤無法截取等問題，以下詳細的說明一下。一
    2025-01-24
  • 淺談HTML5新增與廢棄的標籤

    淺談HTML5新增與廢棄的標籤

    一、廢棄的標籤以下的HTML 4.01 元素在HTML5中已經被刪除，雖然瀏覽器為了兼容性考慮都還支持這些標籤，但建議使用新的替代標籤，矛盾的是老瀏覽器對新標籤的支持度又不夠，視項目的受眾對象而定了。 1.能用CSS代替的元素這些元素包含b
    2025-01-24
  • HTML5拖曳API經典實例詳解

    HTML5拖曳API經典實例詳解

    一、關於拖曳API拖曳API是HTML5的新特性，相對於其他新特性來說，重要程度佔到6成，實際開發中使用比例占到3成，學習要求個人認為是達到掌握即可的程度。二、什麼是拖曳和釋放？拖曳：Drag釋放：Drop拖曳指的是滑鼠點擊來源物件後一直移動
    2025-01-24
  • 分享一個H5原生form表單的checkbox特效程式碼

    分享一個H5原生form表單的checkbox特效程式碼

    本文介紹了分享一個H5原生form表單的checkbox特效程式碼，分享給大家，具體如下：效果如下：<!DOCTYPE html><html><head><meta charset=UTF-8><title></title> <s
    2025-01-24
  • 點擊單選框就直接啟動連結的實現代碼

    點擊單選框就直接啟動連結的實現代碼

    <html><head><!--第一步：把如下代码加入到“head”区域中--><script>function go(HrefName) {window.location.href = HrefName;}</script></head>
    2025-01-24
  • 詳解Html5 Canvas畫線有毛邊解決方法

    詳解Html5 Canvas畫線有毛邊解決方法

    Html5 Canvas 所有的畫線指令畫出來的線條都有毛邊（例如lineTo， arcTo，strokeRect），這是因為在Canvas中整數座標值對應的位置恰巧是螢幕像素點中間的夾縫，那麼當按這樣的座標進行線條渲染時所要用到的就是夾
    2025-01-24
  • canvas環形倒數組件的範例程式碼

    canvas環形倒數組件的範例程式碼

    本文介紹了canvas環形倒數組件的範例程式碼，分享給大家，具體如下：效果如下圖一：Canvas環形倒數組件Canvas環形倒數計時是基於Canvas實現的倒數計時，建議於移動端使用Canvas環形倒數下載地址一、如何使用1. html代
    2025-01-24
  • 淺談基於Canvas的手繪風格圖形庫Rough.js

    淺談基於Canvas的手繪風格圖形庫Rough.js

    前言推薦一個基於Canvas的手繪風格圖形JS庫。 Rough.jsRough.js是一個輕量的（大約8k），基於Canvas的可以繪製出粗略的手繪風格庫。提供繪製線條、曲線、弧線、多邊形、圓形和橢圓的基礎能力，同時支援繪製SVG路徑。 Git
    2025-01-23
  • H5最強接口之canvas實現動態圖形功能

    H5最強接口之canvas實現動態圖形功能

    上個文章我們分享如何利用canvas來進行圖形繪製，但是繪製的都是靜態圖形，本週我們就來學習如何利用canvas進行動態圖形繪製。什麼是動畫？我們在繪製動畫之前必須先弄清楚什麼是動畫，一個動畫最起碼需要哪些基本條件呢？我們可以用一個工具
    2025-01-23
  • 詳解透過focusout事件解決IOS鍵盤收起時介面不歸位的問題

    詳解透過focusout事件解決IOS鍵盤收起時介面不歸位的問題

    問題症狀今天在開發一個行動裝置的H5 頁面時，遇到了IOS 上鍵盤收起時介面無法歸位的問題。以下詳細描述下問題和症狀：頁面結構出問題的頁面是表單結構。即類似於一個div 下有4個input 表單的結構，用於使用者填寫郵寄資訊。類似:
    2025-01-23
  • 前端canvas動畫如何轉換為mp4影片的方法

    前端canvas動畫如何轉換為mp4影片的方法

    用戶透過上傳合適尺寸的圖片，選著渲染動畫的效果和音樂，可以預覽類似幻燈片的效果，最後點擊確認生成視頻，可以放到頭條或者抖音播放。產生視訊可能的方案純前端的視訊編碼轉換(例如WebM Encoder Whammy)圖片位址只能是相對位址音樂不
    2025-01-23
  • HTML5探秘：用requestAnimationFrame優化Web動畫

    HTML5探秘：用requestAnimationFrame優化Web動畫

    requestAnimationFrame是什麼？在瀏覽器動畫程式中，我們通常使用一個定時器來循環每隔幾毫秒移動目標物體一次，來讓它動起來。如今有個好消息，瀏覽器開發人員決定：嗨，為什麼我們不在瀏覽器裡提供這樣一個API呢，這樣一來我們可
    2025-01-23
  • 詳解Canvas 實現炫麗的粒子運動效果（粒子生成文字）

    詳解Canvas 實現炫麗的粒子運動效果（粒子生成文字）

    沒有最好，只有更好，如題所示，這篇文章只要是分享一個用Canvas 來實現的粒子運動效果。感覺有點標題黨了，但換個角度，勉強強算是炫麗吧，雖然色彩上與炫麗無關，但運動效果上還是算得上有點點炫的。不管怎麼樣，我們還是開始這個所謂的炫麗效果
    2025-01-23
上一頁 166167168169170171172173174下一頁