前天跟著b站的乙個老師敲了大概兩個小時左右，老師一直說很簡單，但是實現的步驟對於接觸js時間不太長，或者說連皮毛都不是特別懂的我來說，還是需要多多學習。模板是這個樣子，其中引數需要根據新增的不同設定不同值，根據自己所需要的頁面展示風格，也需要改動相應的margin、position引數，總的來說就是實現三個框架：原框、隨滑鼠移動的半透明矩形框、details展示框。
2.滑鼠放到大圖的時候，動態修改右邊位置
1.2.1顯示乙個區域 用於確認滑鼠放上去的位置
1.2.2顯示右邊區域用於放大的展示效果
window/documentaq
*//*切換實現 list*/
var list = document.queryselector('.list');
imgs = list.queryselectorall('img');
img = document.queryselector('.pic img');
pic = document.queryselector('.itemarea .pic');
cover = document.queryselector('.cover');
detail = document.queryselector('.detail');
list.addeventlistener('mousemove',function(e))
e.target.classname = 'current';}})
pic.addeventlistener('mousemove',function(e)
if(ty<0)
if(tx>250)
if(ty>561)
detail.style.backgroundposition = tx/250*100+'%'+ty/561*100+'%';
cover.style.left =tx+'px';
cover.style.top = ty+'px';
})/*for(var i = 0;i
放大鏡 放大鏡應該怎麼選擇，有那些放大鏡
放大鏡是用以放大物體的凸透鏡，顯微鏡的雛形。通常用來觀察物體細節。放大鏡是焦距比眼的明視距離小得多的會聚透鏡。放大鏡按外表分類可以分為可攜式放大鏡 眼鏡式放大鏡和立式放大鏡。按使用人群分類，可分為老年人閱讀放大鏡 兒童放大鏡 戶外便攜放大鏡 專業鑑定測量放大鏡和醫用放大鏡等。台式放大鏡就是可以固定的...
canvas實現放大鏡
我們先來簡單實現下放大鏡，嗯嗯 電商專案的商品詳情的放大鏡，差不多就是下面這個樣子吧。有點小瑕疵，但至少功能實現了。zoom canvas1,canvas2 style class zoom canvas1 width 600 height 337.335 canvas canvas2 width ...
放大鏡原生實現
分析 難點列出 1.滑鼠在區域時，透明小區域出現，放大的區域出現 2.滑鼠移出時，透明小區域小時，放大區域消失 3.透明小區域隨著滑鼠移動 難點解決關鍵 對應解決回答 1.通過滑鼠onmourseover監聽滑鼠的略過，改變透明小區域和放大區域的display，置為block 2.通過滑鼠onmou...