<!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>
#parent{
width:800px;
height:20px;
background:#ddd;
position:relative;
margin:10 auto;
}
#div1{
width:20px;
height:20px;
background:red;
position:absolute;
left:0;
top:0;
}
#div2{
width:400px;
height:200px;
border:1px solid black;
/* filter:alpha(opacity:0); */
overflow: hidden;
position:relative;
}
#div3{
position:absolute;
left:0;
top:0;
}
</style>
</head>
<body>
<div id="parent">
<div id="div1"></div>
</div>
<div id="div2">
<div id="div3">
如今，AI 技术已经不再是科技企业创业创新的利器，而是全民竞相追逐并实践的热点。
随着相关技术的突破发展以及国家产业政策的大力扶持，人工智能技术以及应用实践已然出现了向上的趋向。作为未来科技发展的重要方向和必然趋势，AI 技术将深入人们生活的方方面面。
本期云+社区技术沙龙，正是基于上述背景，围绕AI技术赋能应用的主题，邀请来自腾讯及四川云检科技等AI技术领域专家进行深入分享和互动，希望可以帮助更多企业以及开发者迅速了解AI 作用于行业应用的点点滴滴，懂技术，会应用，时刻紧追AI 发展浪潮。
时间：2018.07.28 13:30-18:00 周六
地址：北京市北五环咖啡（北京市朝阳区天辰东路11号国家游泳中心3号门2层 李嘉诚东厅）
主办方：云加社区技术沙龙
关注云+社区公众号
实时获取技术干货
演讲嘉宾
</div>
</div>
<script>
var parent=document.getElementById('parent');
var div1=document.getElementById('div1');
var div2=document.getElementById('div2');
var div3=document.getElementById('div3');
var disX=0;
var disY=0;
//开始移动
function mouseMove(ev){
var eve=window.event||ev;
var l=0;
var t=0;
l=eve.clientX-disX;
t=eve.clientY-disY;
//滑动范围
if(l<0){
l=0;
}else if(l>parent.offsetWidth-div1.offsetWidth){
l=parent.offsetWidth-div1.offsetWidth;
}
if(t<0){
t=0;
}else if(t>parent.offsetHeight-div1.offsetHeight){
t=parent.offsetHeight-div1.offsetHeight;
}
div1.style.left=l+"px";
div1.style.top=t+"px";
//滚动条来控制其他物体的宽度
var scale=l/(parent.offsetWidth-div1.offsetWidth);
document.title=scale;
div3.style.top=-scale*(div3.offsetHeight-div2.offsetHeight)+"px";
}
//停止移动
function mouseUp(){
this.onmousemove=null;
this.onmouseup=null;
if(div1.releaseCapture){
div.releaseCapture();
}
}
div1.onmousedown=function(ev){
var eve=window.event||ev
disX=eve.clientX-div1.offsetLeft;
disY=eve.clientY-div1.offsetTop;
if(div1.setCapture){
div1.onmousemove=mouseMove;
div1.onmouseup=mouseUp;
div1.setCapture();
return false;
}else{
document.onmousemove=mouseMove;
document.onmouseup=mouseUp;
return false;
}
}
</script>
</body>
</html>
882
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
