亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

拖拽進度條

拖拽進度條

慕勒8167199 2018-07-14 09:49:50
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><meta http-equiv="X-UA-Compatible" content="ie=edge"><title>Document</title><style>*{padding:0;margin:0;}#box {width: 400px;height: 40px;background: red;position: relative;margin:100px auto;}#child {width: 20px;height: 40px;background: blue;position: absolute;top: 0;left: 0;}.bared {position: absolute;width: 0;height: 40px;background: blueviolet;top: 0;left: 0;}</style></head><body><div id="box"><div id="child"></div><span class="bared"></span></div><script src="js/jquery-1.11.1.js"></script><script>var mouseX = 0;var left = 0;var onOff = false;var maxH = $("#box").outerWidth() - $("#child").outerWidth();$("#child").on("mousedown", function (ev) {onOff = true;var e = ev || event;mouseX = e.clientX;left = $(this).position().left;/* console.log(mouseX,left) */return false;})$(document).on("mouseover",function(ev){if(onOff){var e = ev || event;var mX = e.clientX;var len = mX - mouseX + left;if(len < 0){len = 0;};if(len > maxH){len = maxH;}$("#child").css("left",len);$(".bared").css("width",len)}});$(document).on("mouseup",function(){onOff = false;return false;});$("#box").on("click",function(e){if(!onOff){var mouX = e.clientX;var left = mouX - $("#box").offset().left;if(left > maxH){left = maxH;}$("#child").css("left",left);$(".bared").css("width",left)}});</script></body></html>為什么? 我在拖拽的時候,進度條會出現卡頓的現象,不是很流暢,求? 大牛給予解答,萬分感謝
查看完整描述

1 回答

已采納
?
Stardust1001

TA貢獻261條經驗 獲得超78個贊

哈哈,mouseover改成mousemove試下,我試的可以,一看代碼就知道是新手吧,又一個入坑的

查看完整回答
反對 回復 2018-07-25
  • 慕勒8167199
    慕勒8167199
    真的呀 非常感謝前輩,這個問題沒解決掉,然后就一直擱置了,非常感謝,順便問一句,為什么會這樣嗎?
  • Stardust1001
    Stardust1001
    一個是進去觸發的,一個是進去后持續觸發的。前輩算不上,早了兩年而已
  • 1 回答
  • 0 關注
  • 1413 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號