当前位置:Gxlcms > JavaScript > js解决movebox移动问题_javascript技巧

js解决movebox移动问题_javascript技巧

时间:2021-07-01 10:21:17 帮助过:6人阅读

本文为大家分享了js解决movebox移动问题,并且取消图片默认拖动事件的相关操作,供大家参考,具体内容如下

html:

 
 
 
 
   
  

js:

css:

body { 
  position:absolute; 
  margin:0; 
  padding:0; 
} 
#center{ 
  position:absolute; 
  top:200px; 
  left:300px; 
  width:400px; 
  height:400px; 
  background-color:#808080; 
} 
#black{ 
  position:absolute; 
  width:400px; 
  height:400px; 
  z-index:80; 
  background-color:#000; 
  opacity:0.6; 
} 
#bigimg{ 
  z-index:50; 
  position:absolute; 
  left:100px; 
  top:125px; 
} 
#movebox{ 
  z-index:100; 
  position:absolute; 
  width:100px; 
  height:100px; 
  left:150px; 
  top:150px; 
  overflow:hidden; 
  cursor:move; 
  background-color:#ff6a00; 
} 
#moveimg{ 
  position:absolute; 
  left:-50px; 
  top:-25px; 
} 

以上就是本文的全部内容,希望对大家的学习有所帮助。

人气教程排行