顯示具有 JavaScript 標籤的文章。 顯示所有文章
顯示具有 JavaScript 標籤的文章。 顯示所有文章
2023-03-14

[ThreeJS] 噴水粒子

›
要完成這個效果有三個問題要解決 自然的粒子分布 粒子的拋物線移動 粒子的擴散效果 我採用簡單的方式達成 用亂數產生分段的粒子團 用二次貝茲曲線建立拋物線 用粒子團的放大產生擴散效果 因為我用簡單的亂數分布粒子，粒子團會有立方體現...
1 則留言:
2023-03-07

[ThreeJS] 單次動畫

›
/* 單次動畫 */ function animateOnce(mixer, prop, dur, values) { /* 停止 & 清除 先前的動畫 */ mixer.stopAllAction(); mixer.uncacheRoot(...

[ThreeJS] 用 SVG 貼圖顯示中文

›
HTML <div id="Container"></div> <div id="LabelTpl" style="display:none;"> <svg x...

[ThreeJS] 解決陰影造成的條紋

›
 會出現條紋現象是因為雙面材質，只要設置為單面材質就可以解決。 /* 載入模型 */ new THREE.GLTFLoader().load('Model.glb', function (gltf) { const model = gltf.sc...

[ThreeJS] 載入壓縮過 GLTF 檔

›
/* 解壓縮 lib 載入器 * https://threejs.org/docs/#examples/en/loaders/DRACOLoader * https://google.github.io/draco/ */ const dracoLoader = new ...
2022-09-05

[轉載] opencv js getPerspectiveTransform，perspectiveTransform 方法使用

›
轉載自: opencvjs getPerspectiveTransform，perspectiveTransform方法使用 OpenCV JavaScript版本，使用getPerspectiveTransform，PerspectiveTransform方法。 Java...
2022-07-15

[轉載] CSS 变量教程

›
轉載自： 阮一峰 CSS 变量教程 今年三月，微软 宣布 Edge 浏览器将支持 CSS 变量。 这个重要的 CSS 新功能，所有主要浏览器已经都支持了。本文全面介绍如何使用它，你会发现原生 CSS 从此变得异常强大。 一、变量的声明 声明变量的时候，变量名前面...

[轉載] 跨域资源共享 CORS 详解

›
轉載自： 阮一峰 跨域资源共享 CORS 详解 CORS是一个W3C标准，全称是"跨域资源共享"（Cross-origin resource sharing）。 它允许浏览器向跨源服务器，发出 XMLHttpRequest 请求，从而克服了AJAX只能...
2018-05-12

JavaScript 正規表示式 跳脫

›
RegExp.escape = function(str) { return str.replace(/[-[\]{}()*+?.,\\^$|#\s]/g, '\\$&'); }; /* use sample */ new RegExp(RegE...
2017-03-20

JavaScript 浮點數計算

›
一直一來都很少處理 JS 精準運算的問題，大部分的時候 UI 有點不準也不會造成太大的問題，這次用 JS 做一些加減的數字計算，遇到小數的時候就出現運算誤差，既然是 JS 計算機不精準是不行的，User 不可能接受的，找了一堆文章後沒一個靠譜的，但重點都是轉換到整數進行運算，再做...
2015-11-26

天文鐘

›
2014-11-10

[轉載] Javascript Char Codes (Key Codes)

›
轉載自： Javascript Char Codes (Key Codes) Key Code backspace 8 tab 9 enter 13 shift 16 ctrl 17 alt 18 pause/break 19 caps lock 20 es...
2014-10-02

[轉載] Superpower your JavaScript with 10 quick tips - For Beginners

›
轉載自： Superpower your JavaScript with 10 quick tips - For Beginners Who doesn't love to write better code? In this article I will list ...
2014-05-08

[AngularJS] 製作 jQuery UI Sortable directive

›
Html <div jq-sortable="selectedList"> <div ng-repeat="item in selectedList"> <img ng-src=...

[AngularJS] 製作 Mouse Drag Event directive

›
Html <div ng-style="{'top': itemTop, 'left': itemLeft}" my-mousedrag="itemTop = itemTop - $deltaY; it...

[AngularJS] 製作 jQuery MouseWheel directive

›
相依套件： jquery-mousewheel Html <div jq-mousewheel="changeSize($event, $delta, $deltaX, $deltaY)"></div> JavaScript ...

[AngularJS] 製作 jQuery scrollTop scrollLeft directive

›
Html <div jq-scroll-top="viewerScrollTop" jq-scroll-left="viewerScrollLeft" ></div> JavaScript app...
2014-03-05

利用 HTTP Status Codes 傳遞 Ajax 成功失敗的狀態

›
一般處理 Ajax 回應時會傳送的資訊種類有：資料、成功訊息、錯誤訊息、失敗訊息以及處理狀態，傳遞的資訊種類並不一致，再加上除了資料之外，通常還希望能傳遞處理狀態，這種情況大部分會選擇是以 JSON 的方式傳遞這兩個訊息，以下是常見的幾種格式： { code: 1, msg:...
2014-02-18

[jQuery] $.log 與 $.fn.dump

›
記錄一下，偷懶的 console.log if ($ && $.fn) { $.log = (window['console'] && typeof(console.log)=='function') ? ...

[jQuery] 製作 $.fn.delayAll

›
jQuery 有提供 delay 這個方法，可惜只能用在動畫操作上，想要做到下面的事情就只能用 setTimeout 了。 // not working $('div').css('color','red').delay(20...