**鼠標滾輪事件**
>html
~~~
<p>
<label for="wheelDelta">滾動值:</label>(IE/Opera)<input type="text" id="wheelDelta" />
</p>
<p>
<label for="detail"> 滾動值:(Firefox)</label><input type="text" id="detail" />
</p>
~~~
>js
~~~
var oTxt = document.getElementById("txt");
var scrollFunc = function (e) {
var direct = 0;
e = e || window.event;
var t1 = document.getElementById("wheelDelta");
var t2 = document.getElementById("detail");
if (e.wheelDelta) { //IE/Opera/Chrome
t1.value = e.wheelDelta;
if (t1.value > 0) {
console.log('上滾');
} else if (t1.value < 0) {
console.log('下滾');
};
} else if (e.detail) { //Firefox
t2.value = e.detail;
if (t2.value > 0) {
console.log('上滾');
} else if (t2.value < 0) {
console.log('下滾');
};
}
}
/*注冊事件*/
if (document.addEventListener) {
document.addEventListener('DOMMouseScroll', scrollFunc, false);
}
window.onmousewheel = document.onmousewheel = scrollFunc; //IE/Opera/Chrome/Safari
~~~
- html
- 頭部標簽
- canvas
- md
- DOM
- git常用命令
- css
- 網站
- 默認
- 前綴
- 文本
- 圖片
- 選擇器
- 滾動條
- 強制橫屏
- 響應式
- 動畫
- animation(動畫)
- transition(過渡)
- transform(變形)
- translate(移動)
- 漸變
- 鼠標
- 自定義 Web 字體
- 可視化
- echarts
- 折線圖
- 區域顏色標識
- 分段顯示不同顏色
- 柱狀圖
- 子彈圖
- 分組、柱體寬度、指示器寬度
- 圓角
- 頂部顯示文字
- 雙軸柱狀折線圖
- 雙軸雙列柱狀圖
- 單個柱狀圖
- 多縱向坐標
- 走勢圖
- 橫向百分比
- 最大值和最小值
- 餅圖
- 嵌套
- 分組顯示
- 餅圖結合柱狀圖
- 折線結合餅圖
- 關系圖
- 樹圖
- 地圖
- 標點
- 選中
- 常用
- 圖片超出可拖拽
- 百度導航
- 短信驗證碼倒計時
- video
- TS
- 未整理
- 消失的邊界線問題
- 跟隨
- js
- 兼容
- 數組去重
- 解析 URL 參數為對象
- 圖片懶加載
- 正則
- Photoshop
- 快捷鍵
- 混合模式
- vscode
- vue
- 指令