首頁>網頁設計教程> HTML教程
全部 Dreamweaver教程 Javascript教程 HTML教程 CSS教程 心得技巧 DHTML教程 網頁特效 WEB標準化
HTML教程
  • canvas拼圖功能實作程式碼範例

    canvas拼圖功能實作程式碼範例

    最近做專案的時候遇到照片拼圖的功能，便在這裡分享自己的封裝的canvas拼圖功能，可能代碼寫的不好，如果有疑問或者是有更好的方法的，可以私聊我，或者是評論指出，感謝各位實現的思路其實挺簡單的，主要是透過服務端獲取圖片鏈接，圖片寬度，圖片高度
    2025-01-18
  • 使用HTML截圖並儲存為本機圖片的實作程式碼

    使用HTML截圖並儲存為本機圖片的實作程式碼

    具體程式碼如下所示：<!DOCTYPE html><html><head><meta charset=UTF-8><title> html2canvas_download</title>
    2025-01-18
  • canvas像素畫板的實作程式碼

    canvas像素畫板的實作程式碼

    最近專案上要實現一個類似像素風格的畫板，可以像素小格子可以擦除，框選變色，可以擦出各種圖形，這樣一個小項目看似簡單，包含的東西還真不少。繪製像素格子我們先定義像素格子類別Pixel = function (option) { this.
    2025-01-18
  • webapp字號大小跟隨系統字號大小縮放的範例程式碼

    webapp字號大小跟隨系統字號大小縮放的範例程式碼

    最近做了一個webapp項目，混合式開發，外部原生，內部webview嵌套H5頁面。前端方面採用了vue開發，適配採用的是flexible+rem做的適配。本來一切都很好，可是吧，領導說客戶有的年紀大，看不清楚字體，希望網頁字體可以跟著系統
    2025-01-18
  • 詳解webapp頁面滾動卡頓的解決方法

    詳解webapp頁面滾動卡頓的解決方法

    手機瀏覽器在滾動當前頁面（也可能是縮放頁面）時，由於預設行為被阻止，導致頁面被迫靜止，導致用戶使用體驗差，感覺滾動頁面有停頓感。具體一點的解釋：由於touchstart 事件物件的cancelable 屬性為true，也就是說它的默認
    2025-01-18
  • HTML頁面局部刷新的實作程式碼

    HTML頁面局部刷新的實作程式碼

    事件回應刷新：有請求才會刷新1、透過JS HTML DOM或jQuery取得HTML元素，透過DOM方法或jQuery方法監聽頁面事件，取得使用者請求；2、透過Ajax將使用者請求提交至伺服器，伺服器處理後返回結果，再由Ajax接收資料；3、通
    2025-01-18
  • HTML5之多執行緒(Web Worker)

    HTML5之多執行緒(Web Worker)

    提到HTML5 總是讓人津津樂道，太多的特性和有趣的API 讓人耳目一新。但很多童鞋還停留在語意化的階段，忽略了HTML5 的強烈之處。這節我們來探討一下多執行緒Web-Worker。一、明確JavaScript 是單執行緒Java
    2025-01-18
  • h5使用canvas畫布實現手勢解鎖

    h5使用canvas畫布實現手勢解鎖

    前言最近做的一個app項目使用的apicloud 來實現跨平台開發，現在需要為這個app 添加手勢（九宮格）解鎖的功能，apicloud 已經有一些第三方的原生實現的手勢解鎖插件，因為是原生的性能也比較好，呼叫也比較方便，但是都不能對它
    2025-01-18
  • 詳解透過變換矩陣實現canvas的縮放功能

    詳解透過變換矩陣實現canvas的縮放功能

    這篇文章主要介紹一種透過設定canvas的變換矩陣來實現canvas的縮放。第一步就是監聽滑鼠的滾輪事件，在滾輪事件中根據滑鼠的滾動以及基於前一次的變換，重新設定context的縮放和平移，核心代碼如下：let delta = this.d
    2025-01-18
  • canvas繪製文字內容自動換行的實作程式碼

    canvas繪製文字內容自動換行的實作程式碼

    原型要求:要求製作邀請卡頁面，其中標題字數是動態的，最多可顯示2行，如果超出2行則第2行內容結尾添加省略號。根據產品妹子的性格，四行這個設定到時很大機會改，所以這裡一定不能寫死，結果前幾天真的要求改成了最多可顯示4行，其他照舊。產品妹
    2025-01-18
  • 解鎖canvas匯出圖片跨域的N種姿勢小結

    解鎖canvas匯出圖片跨域的N種姿勢小結

    本文介紹了解鎖canvas匯出圖片跨網域的N種姿勢小結，分享給大家，具體如下：Uncaught DOMException: Failed to execute toDataURL on HTMLCanvasElement: Tainted c
    2025-01-18
  • Html5如何喚起百度地圖App的方法

    Html5如何喚起百度地圖App的方法

    最近接手了一個需求，要求混合式開發，前端做好h5 後將頁面嵌入到ios 和android 中，需要用到百度地圖的地圖導航。具體功能點如下：如果手機端（ios, android）安裝了百度地圖，點擊導航按鈕，喚起百度地圖app否則，打
    2025-01-18
  • canvas實作有遞增動畫的環形進度條的實作方法

    canvas實作有遞增動畫的環形進度條的實作方法

    老規矩，直接看圖！效果如下：高清大圖！碼農多年，老眼昏花，動圖看不清楚？ ！那就看靜態截圖！ ！ ！不同分數效果如下：看完了賣家秀，我們來看看產品的製作過程吧！ canvas繪製圓環1、vue中，<template lang=pug>裡的程式碼如下：ca
    2025-01-17
  • 詳解FireFox下Canvas使用影像合成繪製SVG的Bug

    詳解FireFox下Canvas使用影像合成繪製SVG的Bug

    本文適合適合對canvas繪製、圖形學、前端視覺化有興趣的讀者閱讀。楔子所有的事情都會有一個起因。最近產品上需要做一個這樣的功能：給一些圖形做染色處理。想想這還不是順手拈來的事情，早就研究過圖形染色的技術。於是我把之前寫好的兩種演算法都傳給了
    2025-01-17
  • data:image data url 檔案轉為Blob上傳後端的方法

    data:image data url 檔案轉為Blob上傳後端的方法

    有些場景，像是canvas取得的圖片，或是微信開發sdk回傳的圖片格式是data:img格式的，我們需要上傳到伺服器上，那就需要轉換。將dataURL轉成Blob// base64 轉blobdataURItoBlob(dataURI
    2025-01-17
上一頁 169170171172173174175176177下一頁