61,115
社区成员
发帖
与我相关
我的任务
分享web在线视频同步小窗口播放功能
web视频播放器，当用户下拉网页遮挡住视频的时候弹出div迷你的小窗口继续同步播放视频，当视频主播放器不被遮挡的时候，隐藏div迷你播放器，PS和搜狐视频的功能一样，有没有那位大婶做过 ？或者有类似的插件或者解决方案，或者思路，求指导。
...全文
请发表友善的回复…
发表回复
天际的海浪 2015-09-09
- 打赏
- 举报
代码不是给你了么[/quote]
我测试了，并没有实现功能[/quote]
你用的什么浏览器？是不是版本太低了
小茶杯 2015-09-09
- 打赏
- 举报
代码不是给你了么[/quote]
我测试了，并没有实现功能
天际的海浪 2015-09-06
- 打赏
- 举报
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title> 页面名称 </title>
<style type="text/css">
.box {
width: 720px;
height: 405px;
}
#video {
width: 720px;
height: 405px;
background: #000;
}
#video.min {
width: 320px;
height: 200px;
position: fixed;
left: auto;
top: auto;
right: 0;
bottom: 0;
}
</style>
</head>
<body>
<script type="text/javascript">
window.onscroll = function () {
var top = document.documentElement.scrollTop||document.body.scrollTop;
document.getElementById("video").className = top>400 ? "min" : "";
}
</script>
<div class="box">
<video id="video">
</video>
</div>
<p>01</p>
<p>02</p>
<p>03</p>
<p>04</p>
<p>05</p>
<p>06</p>
<p>07</p>
<p>08</p>
<p>09</p>
<p>10</p>
<p>11</p>
<p>12</p>
<p>13</p>
<p>14</p>
<p>15</p>
<p>16</p>
<p>17</p>
<p>18</p>
<p>19</p>
<p>20</p>
<p>21</p>
<p>22</p>
<p>23</p>
<p>24</p>
<p>25</p>
<p>26</p>
<p>27</p>
<p>28</p>
<p>29</p>
<p>30</p>
<p>31</p>
<p>32</p>
<p>33</p>
<p>34</p>
<p>35</p>
<p>36</p>
<p>37</p>
<p>38</p>
<p>39</p>
<p>40</p>
<p>41</p>
<p>42</p>
<p>43</p>
<p>44</p>
<p>45</p>
<p>46</p>
<p>47</p>
<p>48</p>
<p>49</p>
<p>50</p>
</body>
</html>
小茶杯 2015-09-06
- 打赏
- 举报
继续等待回复
JPF1024 2015-09-06
- 打赏
- 举报
大概思路是：
1.监听滚动事件,如果滚动位置超过了视频播放器的下边位置,暂停大播放器的播放；
2.（不知道行不行）加载视频播放器代码到下方的地址位置上,然后设置自动播放.
控制播放器播放貌似现在一般都是flash，没用js操作过。
小茶杯 2015-09-06
- 打赏
- 举报
继续等待回复
天际的海浪 2015-09-06
- 打赏
- 举报
代码不是给你了么
