拖拽式网站系统php源码-js实现百度登录窗口拖拽效果

前言当我们使用百度相关功能网页时，需要登录自己的账号。但你有关注过百度登录窗口的拖拽效果吗？下面分享一下模仿百度登录拖拽效果的源码！文档类型 htmlhtml

前言

当我们使用百度相关功能网页时拖拽式网站系统php源码，需要登录我们的账号。但是你关注过百度登录窗口的拖拽效果吗？下面给大家分享一下模仿百度登录拖拽效果的源码。

代码



 
 
 
 
  #box{
  width: 200px;
  height: 200px;
  position: absolute;
  left: 100px;
  top: 100px;
  background-color: red;
  }
 
 
 
 
 
  var oBox = document.getElementById("box")
  // 鼠标按下事件
  oBox.onmousedown = function(ev){
  var ev = ev || event
  var difX = ev.clientX - oBox.offsetLeft
  var difY = ev.clientY - oBox.offsetTop
  // 紧接着需要马上去移动鼠标
  oBox.onmousemove = function(ev){
   // 这里的ev和onmousedown里面的ev不一样
   var ev = ev || event
   var oBox_left = ev.clientX - difX
   var oBox_top = ev.clientY - difY
   oBox.style.left = oBox_left + "px"
   oBox.style.top = oBox_top + "px"
  }
  // 当鼠标抬起时不要移动
  oBox.onmouseup = function(){
   oBox.onmousemove = null
  }
  }

总结

以上代码是百度登录窗口效果的实现。小伙伴们拖拽式网站系统php源码，将代码复制到编译器中看看效果吧。希望对正在学习前端开发的小伙伴有所帮助。

相关文章