运行结果如下:
主要思路:
左边有一个div,div里面套着另一个小的div,小的div里放着文字内容。
右边一个div ,div里套着小的div。
rightin 在rightbox里上下移动(有范围限制,不会超出rightbox的范围)的时候,文字随着在leftbox里移动。
代码如下:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<style>
*{
margin:0;
padding:0;
}
#leftbox{
width:500px;
height:500px;
border:10px solid red;
position: relative;
overflow: hidden;
}
#leftin{
width:480px;
padding:10px;
position: absolute;
}
#rightbox{
width: